더 나은 성능을 얻기 위해 개체에 문서 및 창 참조를 저장하는 중

Question

나는 한 가지 질문을하고 옳은 일을하는지 모릅니다.

내가 이렇게 내 pluins의 개체 또는 글로벌 변수에 window 및 document을 정의 : 내가 전화 후

var myplugin = { 
    document : document || {}, 
    window : window || {} 
}; 

그 I는 다음과 같이 필요로 할 때 :

myplugin.window.location.href = 'http://flyflyflymachine.etc'; 

내가 알고 싶습니다 더 나은 성능을 얻거나 불필요하게 필요합니까?

Answer 1

이런 종류의 나노 최적화는 객체 리터럴 이니셜 라이저를 사용하는 대신 플러그인이 IIFE의 관점에서 정의 될 때 생성 된 중첩 된 함수에 이론적으로 더 적합합니다.

코드가 object의 변수를 참조 할 때 자바 스크립트 엔진은 변수 또는 객체 정의가 발견되거나 정의되지 않은 것으로 확인 될 때까지 현재 어휘 범위 레코드를 먼저 검색 한 다음 어휘 스크립트를 검색해야합니다.

루프에 대해 let 변수 정의를 사용하고 함수가 인수와 변수를 보유하기 위해 어휘 범위 레코드가 만들어집니다. 그래서 깊게 중첩 된 for 루프에서는 깊게 중첩 된 함수에서 window 또는 document을 찾기 전에 검사 할 범위 레코드가 여러 개있을 수 있습니다.

전역 또는 외부 함수 참조를 복사하면 검색 할 범위 레코드 수가 줄어들 수 있습니다. 순수한 성능 향상은 복사본을 만드는 오버 헤드가 중개 범위 레코드를 검색하는 JavaSript 엔진의 오버 헤드에 외부 참조가 사용 된 횟수를 곱한 값보다 작은 경우에만 발생합니다. 실제로는 드물고 이득이 적다면 증명하기가 어려울 수 있습니다.

게시물의 플러그인 정의의 종류는 IIFE가 아닌 "개체 개체"초기화 도구로 구성되어 개체 참조 검색 속도를 높이는 기준을 충족시키지 못하고 실제로 실제로 느려질 수 있습니다.

Answer 2

window 또는 document이 염려되는 것 같습니다. 예를 들어이 코드가 Worker 또는 NodeJS 스크립트 내부에서 실행되면 오류가 발생합니다.

그래서 당신은 두 가지 방법으로이 문제를 "최적화"수 :

이

var myPlugin = {}; 
(function myPluginNS(_global) { 
    myPlugin.window = _global; 
    myPlugin.document = _global.document || {}; 
})(this); 

를 사용하여 좋은 팔자 (this 글로벌 객체를 참조, 글로벌 범위에서)를 this 키워드 네임 스페이스를 사용하여 ' 옛날 시도 - 캐치 적어도 VARI에서 실행할 수있는 코드를 보장합니다

var myPlugin = {}; 
try { 
    myPlugin.window = window; 
} catch (e) { 
    myPlugin.window = {}; 
} 
try { 
    myPlugin.document = document; 
} catch (e) { 
    myPlugin.document = {}; 
} 

인정 하듯이, 아니 정말 "최적화"하지만, ous JS 실행 시간.

Answer 3

성능면에서 네 캐싱이 도움이 될 수 있지만 여기에서는 아무 것도 캐시하지 않습니다. 한 조회를 다른 조회로 바꾸는 것만으로 (yourplugin.document 대 window.document).

실제로이 경우 단지 document이 빠르지 만, 단호한 루프를 몇 천 번 반복하지 않는 한 이러한 종류의 나노 최적화는 신경 쓰지 않아도됩니다.