어떻게 자바 스크립트 코드를 속도를.
루프에서 활동을 감소
루프가 주로 사용된다.
을 포함하는 루프의 각 문 for 문 루프가 반복 될 때마다 실행된다.
루프 외부에 배치 할 수 있습니다 문이나 과제를 검색합니다.
잘못된 코드 :
for (i = 0; i < arr.length; i++) {
더 나은 코드 :
l = arr.length;
for (i = 0; i < l; i++) {나쁜 코드 배열의 루프가 반복 될 때마다, 길이 속성을 액세스한다.
더 나은 코드는 루프 외부 길이 속성을 액세스하고 루프 실행 속도합니다.
DOM 액세스를 줄
되는 HTML DOM에 액세스하면 다른 자바 스크립트 구문에 비해 매우 느립니다.
당신은 DOM 요소를 여러 번 액세스 한번 액세스 및 로컬 변수로 사용할 것으로 예상되는 경우
DOM 크기 줄이기
되는 HTML DOM 작은 요소의 수를 유지합니다.
이것은 항상 페이지 로딩을 개선하고, 특히 작은 장치에 (페이지 표시) 렌더링 속도가 향상됩니다.
(getElementsByTagName 같은) DOM을 검색 할 수있는 모든 시도는 작은 DOM에서 도움이됩니다.
불필요한 변수를 피하십시오
당신이 값을 저장하지 않을 경우 새로운 변수를 생성하지 마십시오.
종종이 같은 코드를 대체 할 수있다 :
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
이와 함께 :
document.getElementById("demo").innerHTML = firstName + " " + lastName
지연 자바 스크립트로드
페이지 본체의 하단에 스크립트를 씌우고, 브라우저는 첫 페이지를로드 할 수 있습니다.
스크립트가 다운로드되는 동안 브라우저는 다른 다운로드를 시작하지 않습니다. 또한 모든 구문 분석 및 렌더링 작업이 차단 될 수 있습니다.
HTTP 사양 브라우저 병렬로 두 개 이상의 컴포넌트를 다운로드 할 것을 정의한다.
대안은 사용하는 것입니다 defer="true" 스크립트 태그에. 연기 특성은 페이지를 분석 완료 후에 스크립트가 실행되도록 지정하지만, 단지 외부 스크립트 동작.
가능하면 페이지가로드 된 후, 당신은 코드 페이지에 스크립트를 추가 할 수 있습니다 :
예
<script>
window.onload = downScripts;
function downScripts() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
}
</script>함께 사용하지 마십시오
키워드로 사용하지 마십시오. 이 속도에 부정적인 영향을 미친다. 자바 스크립트 범위까지 그것은 또한 클러.
키워드와는 엄격 모드에서 허용되지 않습니다.