Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [js][jQuery] Optymalizacja skryptów JavaScript?, Wczytywanie potrzebnych skryptów w odpowiednim momencie.
starterrrrr
post 5.08.2015, 12:02:53
Post #1





Grupa: Zarejestrowani
Postów: 138
Pomógł: 0
Dołączył: 7.01.2015

Ostrzeżenie: (0%)
-----


Witam.

Przeglądałem ostatnio mój skrypt na troszke gorszym komputerze i rzuciło mi sie w oczy, że nei dziąła on zbyt wydajnie.

Zasatanawiam sienad optymalizacją skryptów js, zauważyłem, że wiele skryptów dziąła nonstop, niezaleznie czy jest potrzebna czy nie w danym momencie.

Np mam w pliku ze skryptami taki kod:

Kod
$(document).ready(function() {
    //hiding tab content except first one
    $(".tabContent").not(":first").hide();
    // adding Active class to first selected tab and show
    $("ul.tabs li:first").addClass("active").show();  

    // Click event on tab
    $("ul.tabs li").click(function() {
        // Removing class of Active tab
        $("ul.tabs li.active").removeClass("active");
        // Adding Active class to Clicked tab
        $(this).addClass("active");
        // hiding all the tab contents
        $(".tabContent").hide();        
        // showing the clicked tab's content using fading effect
        $($('a',this).attr("href")).fadeIn('slow');

        return false;
    });

});


skrypt zakąłdek. Wykorzystuje to tylko w jednym wyskakującym okienku, cała reszta strony nie potrzebuje tego.
Patrzac na skrypt widać, że ukrywa on elementy, wyświetla inne, cały czas przekopuje strone, widze, że jest sporo takich skrypcików.

Jak sobie z tym radzicie?
mam zrobić 30 plików se skryptami js i doładowywac w odpowiednim czasie?
Go to the top of the page
+Quote Post
Comandeer
post 5.08.2015, 12:09:27
Post #2





Grupa: Zarejestrowani
Postów: 1 268
Pomógł: 254
Dołączył: 11.06.2009
Skąd: Świętochłowice

Ostrzeżenie: (0%)
-----


Nie wiem ile trzeba by było tego typu skryptów, żeby stały się niewydajne.

Może nie 30 plików ze skryptami, ale warto to np. podzielić na moduły (http://addyosmani.com/writing-modular-js/ ) i popakować je tak, żeby te, które są wykorzystywane razem, były w jednej paczce. Na początek wczytać główną paczkę, niezbędną do działania strony, resztę doczytywać w razie potrzeby.

Niemniej sam tego typu skrypt można zoptymalizować np. przepisując go na event delegation i cache'ując wszystkie możliwe elementy (jeśli liczba tabów nie zmienia się w trakcie życia strony, to warto je pobrać raz, wrzucić na zmiennej i operować na niej, a nie na nowo przeszukiwać DOM).


--------------------
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 02:29