• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Za dużo kodu JavaScript do działania pokazu slajdów. Czy da się skrócić ten kod JS ?

VPS Starter Arubacloud
+1 głos
470 wizyt
pytanie zadane 2 marca 2021 w JavaScript przez Krzysiek_34 Mądrala (6,140 p.)
Witam.

Mam taki pokaz slajdów:

https://codepen.io/Krzysiek_39/pen/poNLbgx

Zauważcie, że do działania tego pokazu slajdów jest zapisane aż ok 300 linijek w kodzie JavaScript.

Czy da się skrócić ten kod JS, aby działanie tego pokazu slajdów było tak samo identyczne ?

Byłoby dobrze to skrócić.

2 odpowiedzi

+1 głos
odpowiedź 2 marca 2021 przez Comandeer Guru (604,400 p.)
A jaki problem jest powodowany przez liczbę linii kodu? Bo ostatecznie do użytkownika i tak powinien być wysłany zminifikowany kod.
komentarz 2 marca 2021 przez Krzysiek_34 Mądrala (6,140 p.)

Chodziło mi o to, że im więcej kodu, tym przeglądarka to wszystko dłużej wczytuje. Ten pokaz slajdów składa sie tylko z kilku efektów:

1. Co kilka sekund jest efekt przesunięcia obrazka i pokazania kolejnego obrazka

2. Pod koniec tego efektu jest spowolnione tempo przesuwania każdego obrazka

3. Obrazki przesuwają sie po kolei ---> 1, 2, 3, 4, 5, 6, 1, 2, 3, 4, 5, 6, 1, 2, 3, 4,... (efekt trwający w nieskończoność)

4. Można od razu przejść z obrazka nr 2 do nr 5, z obrazka nr 4 do nr 1, z obrazka nr 3 do nr 6 itd itd - klikając na dole w odpowiednią kropkę (wszystkie dostępne warianty działają)

5. Można od razu przejść bez czekania do poprzedniego (previous) obrazka albo następnego (next) obrazka - klikając na okrągły przycisk

Tam już więcej efektów nie ma, a w kodzie JS zapisane jest aż ok 300 linijek.

Byłoby super, gdybyście potrafili ten kod JS skrócić kilkakrotnie.smiley

Będę bardzo wdzięczny.

komentarz 2 marca 2021 przez Comandeer Guru (604,400 p.)

Chodziło mi o to, że im więcej kodu, tym przeglądarka to wszystko dłużej wczytuje.

 ostatecznie do użytkownika i tak powinien być wysłany zminifikowany kod

Pytanie, jak długo się faktycznie ten kod wczytuje. Robiłeś benchmarki? 

komentarz 2 marca 2021 przez Krzysiek_34 Mądrala (6,140 p.)
edycja 3 marca 2021 przez Krzysiek_34

Nie robiłem żadnego testu.

Gdy uruchamiam stronę główną łącznie z tym pokazem slajdów (przez Notepad++ lub Visual Studio Code), to dopiero po upływie trzech sekund - pokazuje sie pierwszy obrazek.

Podejrzewam, że jeżeli skróciłoby sie tego JS chociażby o połowę, to pierwszy obrazek pokazałby sie 2x szybciej i  byłoby lepiej.

To tylko moja sugestia.

Być może sie mylę, nie wiem.frown

komentarz 2 marca 2021 przez Comandeer Guru (604,400 p.)
Hm, a sprawdzałeś czy to nie przypadek problem z dużym rozmiarem samych obrazków?
komentarz 3 marca 2021 przez Krzysiek_34 Mądrala (6,140 p.)

Całkiem możliwe, że problemem może być duży rozmiar obrazków. Z tymże te linki do obrazków są tylko testowe, bo ja tam umieszczę swoje obrazki (raczej o rozmiarze poniżej 1600x900).

Zamiast:

<a href="#"><img src="https://source.unsplash.com/1600x900/?art" alt=""><span class="caption">Caption for slide 1</span></a>

wpiszę:

<img src="images/foto1.jpg" alt=""><span class="caption">Jakiś tam napis dla slide 1</span>

W tym testowym kodzie HTML - obrazki mają podany (teoretycznie) rozmiar 1600x900.

Ja mogę umieścić jakiś fajny obrazek o rozmiarze powiedzmy 800x600.

Czyli w przypadku tego całego kodu - skalowanie obrazka (o rozmiarze powiedzmy 800x600) bedzie powodowało jego utratę jakości ?

I to bedzie MINUS.

Natomiast PLUS bedzie taki, że obrazek o rozmiarze powiedzmy 800x600 bedzie sie szybciej wczytywał niż ten testowy o rozmiarze 1600x900 ?

0 głosów
odpowiedź 2 marca 2021 przez ScriptyChris Mędrzec (190,190 p.)

Analizując kod, z grubsza w oczy rzuca się zbyt rzadkie korzystanie z chainowania w jQuery i powtarzanie bloków kodu zamiast użycia sparametryzowanych funkcji.

Podobne pytania

+1 głos
2 odpowiedzi 222 wizyt
+1 głos
3 odpowiedzi 770 wizyt
pytanie zadane 15 stycznia 2021 w C i C++ przez rain.deer Początkujący (430 p.)
+1 głos
1 odpowiedź 647 wizyt
pytanie zadane 7 kwietnia 2021 w C i C++ przez Mavimix Dyskutant (8,420 p.)

92,832 zapytań

141,776 odpowiedzi

320,824 komentarzy

62,163 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...