W jednym z moich projektów django używam wielu niestandardowych skryptów jquery i wielu wtyczek jquery typu open source. Teraz, jeśli załaduję wszystkie skrypty jquery w moim szablonie bazowym, załaduję dużo nieużywanego kodu javascript w szablonach, które nie wymagają żadnych / niektórych załadowanych plików jquery, co wpłynie na czas ładowania strony tego konkretny szablon.

Tak więc obecne podejście, które podejmuję, jest

Załaduj podstawowe skrypty jquery w szablonie podstawowym (wymagane przez każdy szablon)Zdefiniuj blok dla js w szablonie bazowym i selektywnie załaduj potrzebne javascript dla każdego templates.e.g{% block selective_js %}{% endblock selective_js %}

Powyższe podejście działa dobrze, ale jedynym problemem, jaki widzę, jest dużo powtórzeń kodu w szablonach. Powiedz na przykład:

Mam następujące pliki javascript

<script type="text/javascript" src="{{ STATIC_URL }}js/jquery.1.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/jquery.2.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/jquery.3.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/jquery.4.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/jquery.5.js"></script>

Teraz w więcej niż jednym szablonie potrzebuję wszystkich wymienionych wyżej plików javascript, a także chcę zainicjować niektóre metody w wymienionych skryptach. Obecnie muszę to zrobić we wszystkich szablonach:

{% block selective_js %}

    <script type="text/javascript" src="{{ STATIC_URL }}js/jquery.1.js"></script>
    <script type="text/javascript" src="{{ STATIC_URL }}js/jquery.2.js"></script>
    <script type="text/javascript" src="{{ STATIC_URL }}js/jquery.3.js"></script>
    <script type="text/javascript" src="{{ STATIC_URL }}js/jquery.4.js"></script>
    <script type="text/javascript" src="{{ STATIC_URL }}js/jquery.5.js"></script>

    <!-- Initialize Methods -->
    <script type="text/javascript">
        $(document).ready(function() {
            $('some_element').initializeScript();
        });
    </script>

{% endblock selective_js %}

Co oznacza, że ​​w szablonach jest wiele powtórzeń kodu.

Pytanie:

Jak mogę zapobiec powtarzaniu kodu bez konieczności ładowania nieużywanego kodu javascript w wydajny sposób?