Bardzo długie ładowanie strony

Witam, nie wiem gdzie leży błąd, strona a konkretnie grafika bardzo długo się ładuje za pierwszym wejściem. Po odświeżeniu jest dobrze. Oto strona:

https://dbgreat.com.pl

Które grafiki? U mnie się załadowało ok, jaką masz przeglądarkę?
247 requestów do załadowania strony - sporo, przeglądarki, zwłaszcza starsze operujące na HTTP/1.1 obsługują tylko 5 requestów per domena więc teoretycznie może to chwilę zająć. Możesz grafikę i statyczne resource'y przenieść na osobną, statyczną subdomenę - większość stron tak robi, zwłaszcza tych opartych o chmurę bo statyczny hosting jest tańszy i szybszy

obscurity napisał(a):

Które grafiki? U mnie się załadowało ok, jaką masz przeglądarkę?
247 requestów do załadowania strony - sporo, przeglądarki, zwłaszcza starsze operujące na HTTP/1.1 obsługują tylko 5 requestów per domena więc teoretycznie może to chwilę zająć. Możesz grafikę i statyczne resource'y przenieść na osobną, statyczną subdomenę - większość stron tak robi, zwłaszcza tych opartych o chmurę bo statyczny hosting jest tańszy i szybszy

Brave, Chrome - na oby dwóch tak samo wolno sie ładuje. Requesty czyli? Uczę się php, sporo już też wiem.

Ta grafika https://dbgreat.com.pl/tlo.png ma 3.6MB, to baardzo dużo, na wolnym łączu może się długo ładować. Zapisz sobie ją jako .jpg albo .webp, powinna ważyć tak z 100 - 200kB. Lepiej to pociąć na mniejsze fragmenty, tekst powinien być tekstem a nie grafiką bo inaczej się nie indeksuje w wyszukiwarkach i bez sensu zajmuje miejsce, nie da się zaznaczyć, wyszukać itp.
Requesty czyli zapytania, odpytywanie resource'ów, skryptów, grafik itp.

BTW coś nie tak ustawiłeś w swoim edytorze grafiki przy eksporcie bo ta sama grafika po otworzeniu i ponownym zapisaniu do png zajmuje 300kB (ponad 10x mniej!).

obscurity napisał(a):

Ta grafika https://dbgreat.com.pl/tlo.png ma 3.6MB, to baardzo dużo, na wolnym łączu może się długo ładować. Zapisz sobie ją jako .jpg albo .webp, powinna ważyć tak z 100 - 200kB. Lepiej to pociąć na mniejsze fragmenty, tekst powinien być tekstem a nie grafiką bo inaczej się nie indeksuje w wyszukiwarkach i bez sensu zajmuje miejsce, nie da się zaznaczyć, wyszukać itp.
Requesty czyli zapytania, odpytywanie resource'ów, skryptów, grafik itp.

BTW coś nie tak ustawiłeś w swoim edytorze grafiki przy eksporcie bo ta sama grafika po otworzeniu i ponownym zapisaniu do png zajmuje 300kB (ponad 10x mniej!).

Tylko jeszcze wczoraj szybko mi sie ładowało a grafiki nie zmieniałem calyczas jest ta sama, po kilku zmianach w kodzie coś zepsułem.

Mariusz Kubielas napisał(a):

Tylko jeszcze wczoraj szybko mi sie ładowało a grafiki nie zmieniałem calyczas jest ta sama, po kilku zmianach w kodzie coś zepsułem.

Po pierwszym załadowaniu masz grafikę w cache więc nie odczuwasz, poza tym może wczoraj miałeś mniej zapchane łącze albo serwer miał lepszy dział, ja mam 1 gbps i nie odczułem na początku że muli, ale na zakładce Network możesz ustawić "Throttling" i symulować np wolne łącze 4g - wtedy widać doskonale że ta grafika waży zdecydowanie za dużo.

OT: moje pierwsze łącze miało 30kbps (sic!), te 3MB by się ładowało kilkanaście minut i byłoby nie do przyjęcia, wtedy strony ważyły z grafikami maksymalnie kilkadziesiąt kB

Okej podmieniłem grafike teraz sie ładuje szybciej i mniej waży ok 300kb. A specjalnie dałem za pierwszym razem bez kompresji 3MB bo chciałem najlepszą jakość. Jedno rozwiązane, przejdźmy dalej. Requesty - jak sprawdzasz ile ich jest ?

Mariusz Kubielas napisał(a):

Okej podmieniłem grafike teraz sie ładuje szybciej i mniej waży ok 300kb. A specjalnie dałem za pierwszym razem bez kompresji 3MB bo chciałem najlepszą jakość. Jedno rozwiązane, przejdźmy dalej. Requesty - jak sprawdzasz ile ich jest ?

ale te 300kB było po zapisaniu png, png jest bezstratny więc jakość była dosłownie ta sama. Requesty i w ogóle wszystkie czasy itp sprawdzasz w devtoolsach (F12) na zakładce Network. W ogóle devtoolsy twoim przyjacielem w kwestiach performance'u i debugowania. Wygeneruj sobie raport na zakładce "Lighthouse" w chrome/edge, zajrzyj też na zakładkę "Issues" i dostaniesz dużo wskazówek co mozna poprawić