Dawno nie pisałam o żadnym narzędziu. Czas to zmienić 🙂 Dzisiaj opiszę Wam narzędzie, które każdy tester niemalże na pewno na pod ręką, ale nie każdy o nim wie, nie każdy też używa.

Lighthouse, bo o nim chcę opowiedzieć, to kolejne po Koa11y i GTmetrix narzędzie, które przyda nam się, jeżeli chcemy testować Front-end naszej aplikacji. Dostęp do niego jak wspomniałam jest bajecznie prosty, zwłaszcza dla tych z nas, którzy używają na co dzień przeglądarki Chrome – od paru już wersji Lighthouse znajdziemy wśród arsenału narzędzi developerskich jakie oferuje Google. Co na temat Lighthouse ma do powiedzenia przeglądarkowy gigant możecie przeczytać sami tutaj.

Aby włączyć narzędzie musimy otworzyć chromowe narzędzia developerskie (Ctrl + Shift + I) i… przejść do zakładki Audits.

Aby rozpocząć analizę klikamy “Perform an audit…” i wybieramy zakres. Nasz serwis możemy przetestować pod kątem:

  • User Experience (czy strona spełnia wymagania Progressive Web Apps)
  • Wydajności
  • Dobrych praktyk nowoczesnego web developmentu
  • Dostępności

Na potrzeby tego wpisu pozostawiłam wszystkie opcje włączone, co pozwoli przy okazji porównać wyniki z tymi wygenerowanymi przy okazji wcześniej opisanych narzędzia.

Po uruchomieniu testu w oknie przeglądarki możemy podpatrzeć, co dla nas robi Lighthouse.

W górnej części znajdziemy opcje, które pozwolą nam uruchomić nowy raport (+) lub pobrać raport jako .json. Jest też lista rozwijana z poprzednimi raportami, dzięki czemu możemy porównać wyniki przed i po poprawkach (jeśli oczywiście takie zrobimy :))

Przejdźmy do tego, co Lighthouse nam wypluł 😛 Test przeprowadzałam jak zwykle na kotqa.pl i (też jak zwykle) specjalnie nie mam się czym chwalić 🙂 Każde z 4 kryteriów zawiera listę audytów które “zaliczyły fejla” oraz tych, które przeszły.

Zacznijmy od tego, co już testowałam, czyli wydajność i dostępność.

W kwestii wydajności Google nie był dla mnie tak łaskawy, jak metryki oferowane przez GTmetrix. Wówczas otrzymałam odpowiednio 89% oraz 72%. Lighthouse wycenia wydajność strony głównej mojego bloga na 58%. W GTmetrix mogłam wygenerować film z testu, a w raporcie omawianego narzędzia znajdziemy oś czasu z klatkami pokazującymi stopień załadowania strony w danej sekundzie. Dodatkowo narzędzi podpowiada co mogę poprawić aby skrócić czas ładowania.

Dostępność wypadła najlepiej – Lighthouse wycenił ją na 89%. Również tutaj znajdziemy wskazówki co poprawić, choć nie tak dokładne i szczegółowe jak w Koa11y/Pa11y. Ale musimy też pamiętać, że Koa11y i Pa11y to narzędzia dedykowane do tylko jednego rodzaju testów.

Test sprawdzający zgodność z Progressive Web Apps wypadł najgorzej – 55%. Dobre praktyki też kuleją, choć jest nieco lepiej – 55%.

I… to by było tyle audytu 🙂 Wiem, że ten wpis jest raczej krótki, ale jego celem było pokazanie Wam, jak proste narzędzie mamy tuż pod ręką. A jak lepiej pokazać prostotę, niż prostym wpisem? 🙂 Lighthouse jest łatwo dostępny i łatwy w obsłudze.

Podobał Ci się wpis? Podziel się ze znajomymi:


Najnowsze wpisy

Teoria vs. Praktyka

Kto z Was nigdy nie zastanawiał się nad tym, czy teoria jest do czegoś potrzebna, niech pierwszy rzuci we mnie „Testowaniem oprogramowania”.

CzytanQA: Trzy książki, bez których nie mogę się obejść

Książka Adama Romana pt. „Testowanie i jakość oprogramowania” jest jedną z trzech, których od długiego czasu nie odkładam nawet na półkę i do których zaglądam niemal codziennie.

Narzędzia, które ułatwiają mi (testerski) żywot

Stawiam, że każdy z Nas zna kilka takich aplikacji, które choć do testów czy programowania nie są zbyt potrzebne, to ułatwiają nam życie i które są jednymi z pierwszych instalowanych na świeżym systemie.