Как кодировать JQuery более модульно?

Question

Я использую фреймворк (Django), и у меня много гибкости в написании HTML. Я продолжаю думать, что способ написания jQuery может быть лучше.

Возьмем для примера: в большинстве случаев, когда на нашем сайте появляется кнопка отправки, мы преобразуем ее в более симпатичную кнопку (принимает исходные значения и поведение и заменяет ее в основном). Это только пример, но есть много случаев, когда у меня есть фрагменты html, размещенные на сайте, и общая структура не имеет представления о том, что на странице нужно манипулировать Javascript. Итак, вопрос из двух частей: эффективно ли выполнять что-то на 100 страницах, которые будут использоваться только на 50 (плагин jQuery, который сначала ищет упакованный набор), и если бы я просто хотел иметь действительно модульный подход с моим jQuery, как бы Я пойду об этом?

Answer 1

Если основная проблема в вашем вопросе касается Модульное программирование . В настоящее время я изучаю Дугласа Крокфорда "JavaScript: Хорошие части" .

Из этой книги:

Функции являются фундаментальной модульной единицей JavaScript. Они есть используется для повторного использования кода, сокрытия информации и компоновки.

Итак, так как в javascript все функции являются объектами, вы можете использовать буквенную нотацию объектов для определения структур верхнего уровня как модулей следующим образом:

/* only one global variable to encapsulate all your code */

var MAINOBJ= {};

jQuery(document).ready(function($) {

    /* modules */

    MAINOBJ.formStuff = {
        results : [],
        myFunction: function (){
            // code
            results = MAINOBJ.ajaxStuff.loadResults();
            // code
        }
    }

    MAINOBJ.ajaxStuff = {
        results : [],
        loadResults: function (){
            // code
            return results;
        }
    }

    /* DOM traversing */

    $('#myForm').submit(function(e) {
        e.preventDefault();
        MAINOBJ.formStuff.myFunction();
    });
})

На самом деле это мой способ структурировать весь мой jquery-код внутри wordpress / joomla и т. Д., Где мы разделяем одну и ту же область видимости с большим количеством javascript-кода иностранца.

Answer 2

Это то, что вам нужно: http://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html.Но это все еще очень экспериментально.А пока посмотрите на инструменты закрытия Google.

Answer 3

При правильном кэшировании, безусловно, более эффективно иметь один минимизированный файл .js. Он будет загружен только один раз, и на странице будет только 1 звонок. Если вы модулируете свой код, вы в конечном итоге будете выполнять больше запросов, не тратя время на дополнительные js, так как они все равно будут кэшироваться.