Skocz do zawartości

Zapanowanie nad JS i CSS ->go to end...


mojeprogramy.com

Rekomendowane odpowiedzi

Mam ok 40 wtyczek chce aby ładowały się:

- jedna pod drugiel

- razem wg. wytycznych (asynchronicznie, czy jakos tak)

- większość była przeniesionych do sekcji footer

Obecnie kazdy WP jest tak skonfigurowany, że wszystkie wtyczki ładują sie do HEAD, a każdy walczy z tym i jakoś nie spotkałem wtyczki która rozwiązuje wszystkie te problemy.

Nie da się przecież zaznaczyć kodu i przenieść do footer-a bo dynamicznie jest to wszytko generowane

a wp_head nie da sie podzielić

 InternetSpeedTest.pl - speed test ookla, orange, upc, t-mobile, vectra | directX.pl - directx 9, 10, 11, 12 | kodex.pl

Odnośnik do komentarza
Udostępnij na innych stronach

Wszystko co generuje się "dynamicznie" w WP skądś musi się brać. Dlatego na początku przeanalizuj kod każdej wtyczki, różni autorzy pewnie będą mieli różne podejście do ich osadzania. Najczęściej będą je dodawali jak w linkach poniżej.

https://codex.wordpress.org/Function_Reference/wp_enqueue_script#Notes

https://codex.wordpress.org/Function_Reference/wp_register_script

Zapoznaj się z tymi linkami dokumentacji, ostatnie parametry poniższych funkcji odpowiadają za osadzanie skryptów w footer. Aby hook zadziałał oczywiście musimy mieć umieszczoną funkcję wp_footer(). Odpowiadając dalej na Twój problem to asynchroniczne ładowanie skryptów JS nie polega na ich statycznym osadzaniu tak jak Ty to chcesz aby przenieść je do footer. Albo mylisz pojęcia albo zamotałeś w poście. Pierwszy lepszy link o asynchronicznym wczytywaniu JS https://blog.kamilbrenk.pl/sposoby-wczytywania-javascript/, mam nadzieję że nie zawiera jakiś większych błędów a na pewno naświetli Ci idee asynchronicznego ładowania JS. Bez przepisania wszystkich 40 wtyczek się nie obędzie. Chyba, że użyjesz jakiegoś packera i skompresuje Ci wszystkie JS w jeden plik :D ale chyba nie o to nam chodzi.

Odnośnik do komentarza
Udostępnij na innych stronach

Oszalałeś 40 wtyczek na jednej instalacji?

Działać działa ale wolno się wczytuje cała ~20sek (wg. narzędzi online) i "składa się" z 150 requestów (css,js,jpg + zewnetrze skrypty)

Ale naocznie to jakieś 9 sekund i dosłownie widać jak wszystko po kolei się ładuje - treść + widzęty, adsense, facbook i jeszcze jedna wtyczka

...bo mylisz pojęcia albo zamotałeś w poście.

Spoko, wiem o co chodzi, tylko wymieszałem wszystko w poście

A ogólnie szukam sposobu dzięki któremu nie bede musiał grzebać w kodzie, używać hook-ów itp.

Szukam wtyczki która sama zadba o generowanie opóźnień w ładowaniu kolejnych skryptów js i css - a nie wszystkie na raz

oraz taka która zajmie sie optymalizacją wczytywania wszystkich js i css

oraz dzieki której bede mógł przenieść wybrane js do stopki - wg, zaleceń optymalizacji

Ale tego nie ma... wszytko ładuje się do sekcji head i lipa powstaje

Chyba, że użyjesz jakiegoś packera i skompresuje Ci wszystkie JS w jeden plik

Jak by sie dało to nie byłoby problemu, tylko jak wyrzucić ładowanie ich do sekcji head?

Pomysł jest jeden (choć ma wadę) mogę wygenerować stronę, skopiować wygenerowany kod + zrobić ręczene porządki i usunąć generowanie <?php wp_head(); ?> a wstawić "ręczną lepianę" i wszytko chodziło by jak złoto

... tylko statycznie by to wszystko zostało ;(

 InternetSpeedTest.pl - speed test ookla, orange, upc, t-mobile, vectra | directX.pl - directx 9, 10, 11, 12 | kodex.pl

Odnośnik do komentarza
Udostępnij na innych stronach

a po co ci tyle wtyczek?

Bo ludziom nie chce się wkleić linijki kodu a potem używają wtyczki do dodania np. favicon i robi się nam 40 wtyczek.

A ogólnie szukam sposobu dzięki któremu nie bede musiał grzebać w kodzie, używać hook-ów itp.

Tak bardzo ogólnikowo o hakach bo już jest późna godzina i zaraz idę spać. WordPress aby ułatwić modyfikowanie szablonów oraz wtyczek blogerom, którzy znają chociaż minimum składni PHP i umieją przekleić kod z dokumentacji wprowadził super rozwiązanie haków (filtrów i akcji). Wywołując za każdym razem stronę po kolei wykonywana jest ogromna ilość funkcji wraz z hakami, my możemy podpinać się pod te haki i przejmować kontrole nad tym co się dzieje w danym momencie. (tutaj trzeba sobie poczytać za co odpowiedzialne są filtru za co akcje) Czyli np. przerzucamy skrypty z header do footer, używamy wyrażeń regularnych na kontencie modyfikujemy sposób budowy linków itp.

Jeszcze raz zajrzałem w Codex i możesz zainteresować się jeżeli chcesz przerzucić wszystkie skrypty z header do footer.

remove_action('wp_head', 'wp_print_scripts');

remove_action('wp_head', 'wp_print_head_scripts', 9);

remove_action('wp_head', 'wp_enqueue_scripts', 1);

add_action('wp_footer', 'wp_print_scripts', 5);

add_action('wp_footer', 'wp_enqueue_scripts', 5);

add_action('wp_footer','thematic_head_scripts');

add_action('wp_footer', 'wp_print_head_scripts', 5);

Ale to i tak nie rozwiązuje Twojego problemu bo dalej uważam, że jednak mylisz pojęcia. Pisząc packera miałem na myśli np. minify https://code.google.com/p/minify/, który łączy w jeden plik JS, w drugi CSS, kompresuje je ale nadal nie doczytuje JS asynchronicznie :)

Przejrzałem bardzo szybko pluginy w repozytorium i tam raczej wszystkie wtyczki napisane są w oparciu o usunięcie akcji z header i wyświetlenie w footer (odpowiedzialne są za to funkcje dodawania i usuwania akcji, które podałem powyżej). Jeżeli chcesz spakować je jednak w jeden plik automatycznie zainteresuj się wtyczką WP Minify, którą też znalazłem w repo, jeżeli będzie dodawała skompresowany skrypt JS w header patrz jak zmienić wyświetlanie go w footer powyżej. BTW przy 40 wtyczkach nie znajdziesz nic automatycznego, co nie sprawi Ci problemu, przecież na bank znajdą się jakieś konflikty, jak pisałem w poście wyżej każdy autor ma jakieś swoje pomysły na napisanie wtyczki, które nie zawsze pokrywają się z codexem.

Odnośnik do komentarza
Udostępnij na innych stronach

Zarchiwizowany

Ten temat przebywa obecnie w archiwum. Dodawanie nowych odpowiedzi zostało zablokowane.

  • Ostatnio przeglądający   0 użytkowników

    • Brak zarejestrowanych użytkowników przeglądających tę stronę.
×
×
  • Dodaj nową pozycję...

Powiadomienie o plikach cookie

Umieściliśmy na Twoim urządzeniu pliki cookie, aby pomóc Ci usprawnić przeglądanie strony. Możesz dostosować ustawienia plików cookie, w przeciwnym wypadku zakładamy, że wyrażasz na to zgodę. Warunki użytkowania Polityka prywatności