Czwarty tydzień projektu
Strona nie wstaje. Klikam odśwież. Znowu to samo.
Zacząłem tydzień od prostego testu: wygenerowałem nową instancję WordPressa, otworzyłem w przeglądarce i czekałem. Skończyło się na trzech dniach grzebania w tym, jak startuje każda strona.
Mam w zwyczaju regularnie uruchamiać świeże instancje WordPressa — czysta instalacja, bez zawartości, z podstawowym zestawem bloków. Robię to, żeby sprawdzić, jak szybko user może zacząć edytować po wygenerowaniu strony. W czwartym tygodniu zrobiłem to samo, co zwykle. Tyle że strona nie wstała.
A właściwie wstała, ale z opóźnieniem. Najpierw biały ekran przez kilka sekund, potem ładowanie assetsów, potem dopiero treść. Dla kogoś, kto otwiera stronę pierwszy raz, te kilka sekund to sygnał, że coś jest nie tak. Dla freelancera, który pokazuje klientowi efekt swojej pracy, to strata czasu i wiarygodności.
boot.log
$ Przed optymalizacją
1. Ładowanie konfiguracji... ✓
2. Łączenie z bazą... ✓
3. Inicjalizacja cache... ✓
4. Ładowanie template... ✓
5. Renderowanie treści... ✓
Czas: ~4.2s — biały ekran do kroku 5
$ Po optymalizacji
1. Ładowanie konfiguracji + cache (równolegle) ✓
2. Łączenie z bazą + przygotowanie template (równolegle) ✓
3. Renderowanie treści (częściowo widoczne od razu) ✓
Czas: ~0.8s — treść widoczna od kroku 1
Zajrzałem więc w to, co dzieje się między kliknięciem przycisku generowania a momentem, gdy strona jest w pełni gotowa. Warstwa startowa — nazwijmy ją bootem — była zaprojektowana tak, żeby wszystko działało. I działało, ale po kolei. Najpierw ładowała się konfiguracja, potem baza, potem cache, potem template, potem treść — każde zadanie czekało, aż poprzednie się skończy.
Szybki start
Równoległa inicjalizacja skróciła boot z ~4,2 s do ~0,8 s. Strona jest widoczna od razu .
Pewność działania
Każda generowana instancja startuje niezawodnie, za pierwszym razem.
Przepisałem to na równoległe inicjalizacje. Tam, gdzie to było bezpieczne, odpalam kilka procesów naraz. Konfiguracja i cache mogą startować równocześnie. Template i treść też nie muszą czekać na siebie — dopiero na końcu składają się w całość. Zmiana wydawała się mała, ale efekt był natychmiastowy: strona przestała mieć biały ekran. Zaczęła pokazywać treść w momencie, gdy jest gotowa choćby w minimalnym stopniu, a reszta dokładała się w tle.
Równolegle zająłem się panelem. Do tej pory interfejs był funkcjonalny — działał, ale wyglądał jak narzędzie developerskie: surowe przyciski, domyślne inputy, żadnych mikrointerakcji. Poprawiłem responsywność formularzy, dodałem stany ładowania w miejscach, gdzie wcześniej był tylko migający wskaźnik, i uporządkowałem nawigację według tego, jak faktycznie user korzysta z panelu, a nie jak mamy poukładane moduły w kodzie. Panel zaczął wyglądać, jakby ktoś go zaprojektował, a nie tylko napisał.
Kiedy skończyłem, uruchomiłem nową instancję. Strona wstała w momencie kliknięcia. Panel był czytelny od pierwszego wejrzenia. Wcześniej myślałem, że te rzeczy są miłe do zrobienia, ale nie priorytetowe. Teraz wiem, że to właśnie one decydują o tym, czy ktoś po pięciu minutach zostaje i mówi, że działa, czy wychodzi, bo jest za wolno.
Kierunek, jaki sobie obrałem: zanim pójdziemy w skalę i więcej użytkowników, każda wygenerowana strona ma startować tak samo pewnie jak lokalny WordPress na moim laptopie. Żadnych białych ekranów, żadnych opóźnień, żadnego odświeżania w nadziei, że zadziała. Freelancer, który używa tego narzędzia, nie ma czasu na tłumaczenie klientowi, że strona się wczytuje. Ma czas na projekt. I to mu daję.
MP
Marcin Pilśniak
Założyciel MagicWP – od ponad 15 lat pracuję przy technologiach webowych, a teraz uczę AI robić to samo.