JavaScript Производительности
Как ускорить ваш код JavaScript.
Уменьшение активности в циклах
Петли часто используются в программировании.
Каждая инструкция в цикле, включая инструкцию for, выполняется для каждой итерации цикла.
Операторы или назначения, которые могут быть размещены вне цикла, сделают цикл более быстрым.
Плохо:
var i;
for (i = 0; i <arr.length; i++) {
Лучший код:
var i;
var
l = arr.length;
for (i = 0; i <l; i++) {
Неправильный код обращается к свойству Length массива каждый раз при итерации цикла.
Лучший код обращается к свойству Length вне цикла и ускоряет выполнение цикла.
Сокращение доступа к DOM
Доступ к HTML DOM очень медленный, по сравнению с другими заявлениями JavaScript.
Если вы ожидаете получить доступ к элементу DOM несколько раз, доступ к нему один раз, и использовать его в качестве локальной переменной:
Пример
var obj;
obj = document.getElementById("demo");
obj.innerHTML = "Hello";
Уменьшить размер DOM
Сохранить количество элементов в DOM HTML Small.
Это всегда улучшит загрузку страницы и ускорит рендеринг (отображение страницы), особенно на небольших устройствах.
Каждая попытка поиска DOM (например, жетелементсбитагнаме) выиграет от меньшего DOM.
Избегайте ненужных переменных
Не создавайте новые переменные, если не планируется сохранять значения.
Часто можно заменить код таким:
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
При этом:
document.getElementById("demo").innerHTML = firstName + " " + lastName
Задержка загрузки JavaScript
Размещение скриптов в нижней части текста страницы позволяет браузеру сначала загрузить страницу.
Во время загрузки скрипта браузер не будет запускать другие загрузки. Кроме того, все операции синтаксического анализа и визуализации могут быть заблокированы.
Спецификация HTTP определяет, что браузеры не должны загружать более двух компонентов параллельно.
Альтернативой является использование отложенного = "true" в теге скрипта. Атрибут отсрочки указывает, что сценарий должен выполняться после завершения синтаксического анализа страницы, но он работает только для внешних скриптов.
Если возможно, вы можете добавить свой скрипт на страницу по коду, после загрузки страницы:
Пример
<script>
window.onload = function() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
};
</script>
Избегайте использования с
Избегайте использования ключевого слова with. Это отрицательно сказывается на скорости. Он также беспорядок вверх JavaScript областей.
Ключевое слово WITH не допускается в строгом режиме.
