Co musisz wiedzieć o wydajności stron i aplikacji? Mateusz Krzeszowiak o Web Performance

W tym odcinku, wraz z ekspertem Mateuszem Krzeszowiakiem odpowiadamy na pytania:
- co to jest web performance?
- dlaczego warto się go uczyć?
- co początkujący front-end developerzy i developerki muszą wiedzieć na temat wydajności?

00:00 - Intro
00:48 - Mateusz Krzeszowiak
02:44 - Co to jest wydajność stron i aplikacji?
05:23 - Po co zajmować się wydajnością stron i aplikacji?
11:43 - Jak mierzyć wydajność stron i aplikacji?
18:10 - Częste błędy i techniki optymalizacji
47:17 - Co początkujący muszą wiedzieć?
50:43 - Gdzie można znaleźć Mateusza
51:45 - Outro

[JZP]

Macie jakieś pytania do Mateusza? Wpisujcie w komentarzach!

[DMT]

Ciekawy odcinek. Przydaloby się więcej konkretów. Np dłuższy odcinek gdzie badana jest duża strona jednej z bardzo znanych firm, gdzie są różne komponenty, ponadto ładują się zewnętrzne usługi spowalniające strone i moze cos jeszcze dla utrudnienia. W filmie mozna by bylo pokazac dobre praktyki, jak podchodzic, czym zbierac gdzie zapisywac, zestawiac te dane, jak interpretować wyniki itp... cos w rodzaju weź ticket z jiry na przetestowanie konkretnegp pagea i jak sie do tego zabrac od A (wziecie ticketa) do Z (zaprezentowanie wynikow klientowi). Z zasady wyobrażam sobie, że tego typu testy może nie są wymagane non stop, może bardziej jak wykryto przez użytkowników, że strona za wolno działa, z uwagi na duże niezadowolenie leci hejt, polecialo kilka ticketow w Jirze na optymalizacje, wiec dla mnie logicznym stepem jest zebranie metryk przed rozpoczeciem optymalizacji i nastepnie po zakonczeniu optymalizacji, gdzie powinnismy miec wynik ogolny jak strona dzialal wczesniej a jak dziala teraz i jak poszczegolne improvmenty poprawily performance konkretnych elementow na stronie.

[elvispreslay]

Bardzo dużo przydatnych i ciekawych informacji, brawo chłopaki dziękuję za materiał

[dawidmalik]

Mam prośbę do Kacpra, żeby przy następnym nagraniu starał się unikać powtarzania "ok", "yhy". Odwraca to uwagę od tego co mówi gość. A tak poza tym, to świetny materiał. Dzięki

[jaqb_]

Fajny materiał.
Przydatna by była też rozmowa z kimś od bezpieczeństwa aplikacji.
Coś w rodzaju checklisty elementów niezbędnych do sprawdzenia w każdej nowej aplikacji oraz listy elementów, o których developerzy często zapominają (lub nie wiedzą) przed wypuszczeniem na PROD.

[mateuszzych]

Witam nagrywacie super merytoryczne i uczące filmy oglądam was od dłuższego czasu i prośba od widza mogli byście nagrać film jak zrobić na stronie internetowej
-w pełni działającą i zapisującą rejestrację konta użytkownika na napisanej stronie
- i w pełni działające logowanie do tego konta też na tej stronie
Z góry dziękuje strasznym problemem mi to sprawia i nie wiem jak do tego podejść jeszcze raz dziękuję za pomoc.

[RobieMVPAplikacjeKarolBocian]

Czy macie zautomatyzowane w jakiś sposób mierzenie wydajności strony (np. co godzinę odpala się automat, który mierzy wydajność i zgłasza ostrzeżenie, jeżeli został przekroczony próg)?

[piotrzakrzewski]

Z tymi rozdzielczościami to się coś zagmatwało. 1. ajfony od 10 (X) czyli od 5 lat mają PPI na poziomi 450~460.. flagowce android np SG s22 ma 420 PPI. tak więc różnica w drugą stronę, ale pomijalna. 2. Wspomina to Autor, z rozdzielczości smartfonów wynika, że trzeba dawać obrazki ponad 1100 px na szerokość.. czyli jak w małym desktopie... i tu przydaje się właśnie picture zamiast img by smartfonom dac dobrą rozdzielczość, ale bez przesady.. np ~800 px ... no ale trzeba wdrażać picture z podziałem na urządzenia klienckie.

[zyki_]

Ja przejść od ciągłego oglądania tutoriali do ćwiczeń i praktyki kodowania? Trochę utknęłam 😅

[marcin]

Osobom poszukującym rozwiązania dla problemu zbyt dużych plików CSS polecam "Tailwind CSS", który generuje ultra małe pliki wynikowe bazując wyłącznie na używanych przez nas klasach CSS. To zgoła odmienne podejście w porównaniu do Bootstrap'a, który zawsze dołącza nam całą swoją kolekcję klas. Jest to związane z tym, że Bootstrap nie bierze pod uwagę tego czego faktycznie używamy, a Tailwind analizuje nasz kod HTML (oraz JS!).

[saskia]

Osobiście zaskoczyło mnie to z fontami xD

[lmartyn]

bardzo dobry temat. Dzięki za poruszenie
PS. mikrofon dobrze zbiera stukanie w biurko :-(

[Sebeklis]

Performance przy uzywaniu frameworkow, nikt przeciez juz nie pisze stron w czystym html i css

[bartoszjasinski]

W przyszłości powstrzymajcie się z waleniem rękami o blat bo mikrofon to wszystko zbiera.