Front-end и Joomla

  • Суббота, 13 декабря 2014

Приветствую уважаемых читателей!

Front-end технологии в последние годы получили большую популярность и широкое применение. Клиентские приложения стали сложнее, функциональнее и, как это не парадоксально звучит, быстрее.

Ни для кого не секрет, что оптимизация js на Joomla - это довольно трудоемкий процесс. Много разных расширений, имеющих не всегда качественный код, только усугубляют ситуацию.

Хочу предложить использовать для загрузки JavaScript RequireJs, небольшую библиотеку, при помощи которой мы можем загружать js асинхронно. Что это даст? Для понимания этого немного коснемся теории. Итак, в браузере страница загружается последовательно. Обычно вначале подключают css, далее идет js. Довольно часто подключаемый javascript имеет серьезный вес в килобайтах (и мегабайтах тоже). И пока он весь не загрузится, наши тексты и картинки не отобразятся. RequireJs позволяет загружать js асинхронно, не блокируя загрузку последующих элементов.

Но сразу хочу предупредить, все это делается в последнюю очередь. Когда сайт уже готов и никаких новых расширений добавляться не будет. Потому что, если мы подключим асинхронно JQuery, то ее плагины могут быть загружены быстрее самой библиотеки. Это приведет к возникновения ошибок. RequireJs позволяет создавать зависимости и загружать js библиотеки и фреймворки с CDN. Например вот так:

requirejs.config({
    "baseUrl": "js/lib",
    "paths": {
      "app": "../app",
      "jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min"
    }
});

define(["jquery", "jquery.alpha", "jquery.beta"], function($) {
    //the jquery.alpha.js and jquery.beta.js plugins have been loaded.
    $(function() {
        $('body').alpha().beta();
    });
});

define(["jquery"... является созданием зависимости подключенной библиотеки JQuery. "jquery.alpha", "jquery.beta" - другие зависимости, например, подключаемые плагины jquery.

Сложность варианта в том, что нужно собрать в него весь javascript, который используется на сайте. Все модули, плагины, компоненты и скрипты шаблона. Но конечный результат стоит усилий.

P.S. В поисках информации наткнулся на обсуждение и предложенное решение, чтобы добавлять js модульно. Возможно кому-то поможет.

Joomla!® CMS — пожалуй, лучшая система управления контентом с открытым исходным кодом

Логотип Joomla

Joomla! — это больше, чем просто программное обеспечение, это люди, включающие разработчиков, дизайнеров, системных администраторов, переводчиков, копирайтеров, и, что самое главное — простых пользователей.

Мы рады пригласить вас в ряды нашего сообщества!

Свернуть

Коротко о главном в Joomla

Новости портала

Новое в блогах

Видео

Форум о Joomla