Загрузка JavaScript по имени класса

Автор Тема: Загрузка JavaScript по имени класса  (Прочитано 1001 раз)

Оффлайн 4X_ProАвтор темы

  • Бизнес оценка: (0)
  • Пользователь
  • **
  • СПАСИБО: 25
  • Сообщений: 95
  • Карма: 5
  • Непразднующий Боец
  • Награды SEO-специалист
    • Просмотр профиля
    • Мультиблог

Оффлайн 4X_ProАвтор темы

  • Пользователь
  • **
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 25
    • Сообщений: 95
    • Карма: 5
    • Непразднующий Боец
    • Награды SEO-специалист
      • Просмотр профиля
      • Мультиблог
При верстке сайтов, использующих большое количество JavaScript-эффектов часто возникает вопрос, как эти самые JavaScript загружать. С помощью обычного тега script получается долго и медленно из-за того, что их загрузка блокирует отображение сайта, объединить все в один большой файл — тоже плохо: зачастую на отдельно взятой странице сайта нужны далеко не все скрипты.
В итоге я нашел такое решение: загружать сначала основные скрипты, которые используются почти всегда, а дальше делать проверку на наличие классов с определенным именем по событие DOMready и догружать только те скрипты, которые нужны для работы с соответствующим классом. При таком подходе догрузка скриптов происходит уже после того, как основной контент страницы отобразился, в результате чего визуально сайт отображается быстрее. У себя в блоге я привел пример кода с загрузкой JavaScript по имени классов, который реализует подобное с использованием библиотеки jQuery.
« Последнее редактирование: 16-04-2015, 21:23:43 от 4X_Pro »
4xpro.ru — мой блог о Web-разработке и ускорении загрузки сайтов. Работает на моем собственном форумном движке.


Оффлайн zhel_kon

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 151
  • Сообщений: 396
  • Карма: 14
    • Просмотр профиля

Оффлайн zhel_kon

  • Старожил
  • ****
Re: Загрузка JavaScript по имени класса
« Ответ #1 : 16-04-2015, 22:25:34 »
В "<head>" монтируем ссылку на основной файл jQuery по умолчанию. Затем в зависимости от исполняемого модуля мы выбираем нужный файл js, а так же подключаем нужный класс, который используется в данном модуле (инклюдом выше заголовка) в зависимости от модуля. Это все реализуется легко в ПХП. Плюсы: уменьшается вес загружаемой страницы. Минусы: снижается "читаемость" кода.
 Можно jQuery тож по надобности подгружать.

Оффлайн 4X_ProАвтор темы

  • Бизнес оценка: (0)
  • Пользователь
  • **
  • СПАСИБО: 25
  • Сообщений: 95
  • Карма: 5
  • Непразднующий Боец
  • Награды SEO-специалист
    • Просмотр профиля
    • Мультиблог

Оффлайн 4X_ProАвтор темы

  • Пользователь
  • **
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 25
    • Сообщений: 95
    • Карма: 5
    • Непразднующий Боец
    • Награды SEO-специалист
      • Просмотр профиля
      • Мультиблог
Re: Загрузка JavaScript по имени класса
« Ответ #2 : 17-04-2015, 01:43:21 »
При вашем подходе загрузка в таком случае будет блокирующей, что особенно почувствуется, если JS-файлов больше восьми (максимальное количество подключений к серверу по умолчанию в большинстве современных броузеров). Т.е. время до первого отображения контента будет вместо 0.3-0.4 секунд (а на некоторых своих сайтах я и лучших показателей добивался, правда, там картинок почти нет) будет 1.5-2 секунды. Собственно, ради того, чтобы избавиться от этого, я и придумал то решение, которое описал в блоге.
4xpro.ru — мой блог о Web-разработке и ускорении загрузки сайтов. Работает на моем собственном форумном движке.


 

Похожие темы

  Тема / Автор Ответов Последний ответ
2 Ответов
1275 Просмотров
Последний ответ 16-10-2010, 13:24:29
от Sevab
1 Ответов
6187 Просмотров
Последний ответ 07-10-2011, 09:25:20
от Shveik
3 Ответов
1718 Просмотров
Последний ответ 21-06-2012, 12:27:43
от ReCopier
27 Ответов
7214 Просмотров
Последний ответ 08-02-2013, 21:13:36
от Нол
7 Ответов
2504 Просмотров
Последний ответ 20-05-2017, 15:52:30
от bratmos