> 웹 프론트엔드 > JS 튜토리얼 > JavaScript로 고성능 데이터 저장소 구현

JavaScript로 고성능 데이터 저장소 구현

黄舟
풀어 주다: 2017-02-20 14:29:02
원래의
1230명이 탐색했습니다.

1. JavaScript에는 리터럴, 지역 변수, 배열 요소, 객체 멤버라는 네 가지 기본 데이터 액세스 위치가 있습니다.

일반적으로 말하면: [리터럴, 지역 변수] 실행 속도>[배열, 객체 멤버]

2. 내부 속성에는 생성된 함수의 값이 포함됩니다. 범위에 있는 개체입니다. 이 세트를 범위 체인이라고 합니다.

3. 함수 실행 -> 실행 환경 생성 -> 활성 개체(예: 함수 런타임 변수 개체)를 만듭니다.

따라서 동일한 함수를 여러 번 호출하면 여러 실행 환경이 생성됩니다.

4. 함수 실행 과정

변수를 만날 때마다 데이터를 얻거나 저장할 위치에 대한 식별자 확인 과정을 거칩니다. 이 프로세스는 실행 환경의 범위 체인을 검색합니다. 성능에 영향을 미치는 것은 바로 이 검색 프로세스입니다.

5. 식별자 파싱 성능

전역 변수는 항상 실행 환경 범위의 끝에 존재합니다. 지역 변수가 먼저 해결됩니다.

경험 법칙: 교차 범위 값이 함수에서 두 번 이상 참조되는 경우 이를 로컬 변수에 저장하세요.

예:

function initUI(){
 var bd=document.body;
 //后面有多次doucument这个全局对象的调用
}
//->优化后
function initUI(){
 var doc=document;
  bd=doc.body;
 //把doucument这个全局对象的引用存储到局部变量doc中
 
}
로그인 후 복사



6. 범위 체인 변경

일반적으로 실행 환경의 범위 체인은 변경되지 않습니다.

<1>with는 범위 체인을 일시적으로 변경할 수 있습니다

width는 객체의 모든 속성에 대한 변수를 만드는 데 사용됩니다

function initUI(){
 with(document){
 var bd=body; 
 }
}
로그인 후 복사



with로 코드가 실행되면 실행 환경의 스코프 체인이 일시적으로 변경됩니다. 매개변수로 지정된 개체의 모든 속성을 포함하는 새로운 변수 개체가 생성됩니다. 이 객체는 스코프 체인의 첫 번째 위치에 푸시되므로 이때 모든 지역 변수는 두 번째 스코프 체인 객체에 있으므로 액세스 비용이 더 높습니다.

<2>try-catch

try 문에서 오류가 발생하면 실행 프로세스가 자동으로 catch로 점프합니다. 그런 다음 예외 개체를 변수 개체에 푸시하고 범위의 맨 위에 놓습니다.

참고: catch 하위 문이 실행되면 범위 체인이 이전 상태로 돌아갑니다.

7. 클로저로 인한 성능 문제

클로저는 JavaScript의 가장 강력한 기능 중 하나입니다.

클로저에는 환경의 범위 체인을 실행하는 동일한 개체에 대한 참조가 포함되어 있으므로 함수의 활성 개체가 삭제되지 않아 더 많은 메모리 오버헤드가 발생합니다.

성능 관련 우려 사항: 교차 범위 식별자에 자주 액세스하면 액세스할 때마다 성능 저하가 발생합니다.

시작:19:41:45 2015-11-21 Aaron 인용: /content/3493261.html

8. 메모리 누수

메모리 누수는 브라우저 프로세스가 종료될 때까지 할당된 메모리 조각을 사용하거나 재활용할 수 없음을 의미합니다. C++에서는 메모리가 수동으로 관리되기 때문에 메모리 누수가 자주 발생합니다. 요즘 C#, Java 등 대중적인 언어는 자동 가비지 수집 방식을 사용하여 메모리를 관리하며, 일반적인 사용 시에는 메모리 누수가 거의 발생하지 않습니다. 브라우저도 자동 가비지 수집을 사용하여 메모리를 관리합니다. 그러나 브라우저의 가비지 수집 방법에 버그가 있어 메모리 누수가 발생할 수 있습니다.

여러 메모리 누수 사례

순환 참조

Javascript 클로저

DOM 삽입 순서

DOM 객체는 Javascript 객체에 의해 참조되는 동시에 동일하거나 다른 Javascript 객체를 참조하는 경우 DOM 객체로 인해 메모리 누수가 발생할 수 있습니다. 이 DOM 개체에 대한 참조는 스크립트가 중지될 때 가비지 수집기에 의해 회수되지 않습니다. 참조 순환을 끊으려면 DOM 요소를 참조하는 객체나 DOM 객체에 대한 참조를 null로 할당해야 합니다.

자세한 내용은 자세히 논의되었으며 여기에 요약이 있습니다

JS 메모리 누수, 요소가 DOM에서 제거되는 것은 당연하지만 여전히 변수나 개체가 있습니다. 참조 DOM 개체입니다. 그러면 메모리에서 삭제할 수 없습니다. 이로 인해 브라우저의 메모리 사용량이 높게 유지됩니다. 이 메모리 사용량은 브라우저가 새로 고쳐지면 자동으로 해제됩니다.

또 다른 상황은 DOM 개체와 JS 개체가 서로를 참조하는 경우입니다. 이는 새로 고쳐도 메모리가 줄어들지 않는 상황입니다. 이는 엄밀한 의미에서 메모리 누수입니다.

위 내용은 JavaScript로 고성능 데이터 저장을 구현한 내용입니다. 더 많은 관련 내용은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿