Июл 18

Вот, наконец, пришло это долгожданное время… я ухожу в отпуск! Будет 3 недели без интернета, проблем, паники и всего остального, что имеет место в повседневной жизни. Отпуск ждал долго, так что событие очень радостное ;-)

P.S.: да здравствует отдых в Геническе!

Июл 2

Часто веб разработчик пишет javascript код не обращая особого внимания на производительность (особенно при использовании какого-либо framework’а). Но когда javascript становится основной частью приложения следует занятся оптимизацией. Хочу поделиться некоторыми советами из личной практики.
Одной из главных характеристик веб приложения является скорость загрузки. Уже на этом этапе можна оптимизировать следующие вещи:

  • количество подключаемых javascript (и css) файлов
  • размер загружаемых файлов

Для того чтобы получить javascript или css файл браузер отсылает GET запрос на сервер. При чем время загрузки примерно одинаково для файлов с разным размером (10 - 100 Kb). Из этого следует, что чем больше файлов мы подключаем, тем больше времени необходимо браузеру, чтобы их загрузить (даже не смотря на их размер). Поэтому, желательно минимизировать количество подключаемых скриптов.

Размер загружаемых файлов - тоже важный момент. Рекомендуется минимизировать размер файлов путем удаления комментариев, лишних пробелов и т.д. Это можно сделать при помощи данного ресурса: http://dean.edwards.name/packer/. Я написал свой codeMinifier на php - и вам советую тоже, потому что инструмент Дэна Эдвардса не корректно минимизирует javascript файлы с регулярными выражениями. Также можно воспользоваться Java приложением YUI Compressor.

После минимизации javascript файла его можно запаковать в архив gzip. Большинство современных браузеров поддерживают Content-Encoding:  gzip (кроме Safari). Такое сжатие практически не снижает производительности скриптов, но отлично сказывается на времени загрузки страницы.

Вторая сторона оптимизации javascript - это оптимизация самого кода. Данная тема заслуживает отдельной статьи, но я хотел бы отметить, что при использовании jQuery остерегайтесь использования метода html() - лучше используйте “родной” для javascript способ - свойство innerHTML. А в прочем, можете сами поэкспериментировать, замеряя скорость работы своих javascript функций:

function doSomething()
{
  var  st = new Date();

  // код функции

  alert(“Время выполнения doSomething = “ + parseInt(new Date() - st ,10));
}

Оптимизируйте, и да будет вам щастье ;-)))