[{"data":1,"prerenderedAt":116},["ShallowReactive",2],{"project-\u002Fpl\u002Fprojekty\u002F2026\u002Fpesi-pl":3,"project-posts-\u002Fpl\u002Fprojekty\u002F2026\u002Fpesi-pl":115},{"id":4,"title":5,"agency":6,"body":7,"compare":21,"cover":62,"date":64,"description":65,"draft":66,"extension":67,"facts":68,"featured":66,"gallery":81,"galleryLead":81,"highlights":82,"image":95,"links":96,"meta":98,"navigation":99,"note":100,"ogImage":101,"path":102,"seo":103,"stack":104,"stem":111,"tags":112,"__hash__":114},"projects_pl\u002Fpl\u002Fprojekty\u002F2026\u002Fpesi-pl\u002Findex.md","pesi.pl – nowa wersja strony","Pesi",{"type":8,"value":9,"toc":17},"minimark",[10,14],[11,12,13],"p",{},"pesi.pl to strona firmy, w której pracuję. Stara wersja działała na Laravelu i każdą zmianę – także każdy wpis na blogu – wklejał programista, a nie marketing. Przepisałem ją na WordPressa z motywem blokowym, żeby marketing mógł sam publikować i łatwiej śledzić zmiany na stronie. Kod napisał Claude Code. Ja przemyślałem całość tak, żeby nie powtórzyć błędów z wersji na Laravelu, decydowałem o układzie i komponentach i sprawdzałem każdy widok. Przeniosłem też realizacje i wszystkie wpisy z bloga tak, żeby zachowały dotychczasowy wygląd.",[11,15,16],{},"Najbardziej zależało mi na tym, żeby strona była lekka i nie ciągnęła się w nieskończoność na telefonie – w stopce jest kontakt, więc droga do niej powinna być krótka.",{"title":18,"searchDepth":19,"depth":19,"links":20},"",2,[],{"before":22,"after":28,"rows":32,"note":61},{"src":23,"width":24,"height":25,"label":26,"alt":27},"\u002Fprojects\u002F2026\u002Fpesi-pl\u002Fold-home-top.webp",1440,900,"Przed · strona na Laravelu","Stara strona pesi.pl – pierwszy ekran",{"src":29,"width":24,"height":25,"label":30,"alt":31},"\u002Fprojects\u002F2026\u002Fpesi-pl\u002Fhome-top.webp","Po · strona na WordPressie","Nowa strona pesi.pl – pierwszy ekran",[33,37,41,45,49,53,57],{"label":34,"before":35,"after":36},"Wydajność w Lighthouse","70","99",{"label":38,"before":39,"after":40},"JavaScript","2055 kB","37 kB",{"label":42,"before":43,"after":44},"CSS","58 kB","16 kB",{"label":46,"before":47,"after":48},"Waga strony","2,6 MB","362 kB",{"label":50,"before":51,"after":52},"Zapytania","131","47",{"label":54,"before":55,"after":56},"Total Blocking Time","178 ms","0 ms",{"label":58,"before":59,"after":60},"Wysokość strony (px)","14 553","10 058","Strona główna na telefonie, mediany z 3 przebiegów Lighthouse. Przed – kopia starej strony z Internet Archive (17.07.2026), wagi bez skryptów archiwum, czasy i oceny orientacyjne. Pomiary sprzed dodania analityki – z Google Tag Managerem strona główna ma w Lighthouse w Chrome 99 (ze zgodami) i 100 (bez zgód).",{"desktop":29,"phone":63,"width":24,"height":25,"alt":31},"\u002Fprojects\u002F2026\u002Fpesi-pl\u002Fhome-phone-top.webp","2026-11-10","Strona firmy, w której pracuję: z Laravela na WordPressa z edytorem bloków, żeby marketing sam publikował wpisy. Lżejsza, krótsza na telefonie i z animowanymi kostkami 3D.",false,"md",[69,72,75,78],{"value":70,"text":71},"70 → 99","wydajność strony głównej w Lighthouse na telefonie",{"value":73,"text":74},"2 MB → 37 kB","JavaScriptu na stronie głównej na telefonie",{"value":76,"text":77},"18 → 12","ekranów telefonu do przewinięcia na stronie głównej",{"value":79,"text":80},"100","dostępność, dobre praktyki i SEO w Lighthouse na wszystkich mierzonych stronach",null,[83,86,89,92],{"title":84,"text":85},"Marketing publikuje sam","Wcześniej każdą zmianę i każdy wpis wklejał ktoś z frontu albo backendu. Teraz wpisy powstają w edytorze bloków, a w artykule można zaznaczyć, kto jest autorem.",{"title":87,"text":88},"Karuzele zamiast długich list","Gridy z wieloma elementami są na telefonie i tablecie karuzelami na CSS scroll-snap. Widać kawałek następnego slajdu, a strona jest krótsza – do stopki z kontaktem jest bliżej.",{"title":90,"text":91},"Kostki 3D, które nie spowalniają","Najpierw wczytuje się zwykłe zdjęcie, a scena Three.js dopiero po załadowaniu strony – tylko na szerszych ekranach i bez ograniczenia ruchu.",{"title":93,"text":94},"Skrypty dopiero wtedy, gdy są potrzebne","reCAPTCHA wczytuje się przy pierwszym kontakcie z formularzem, odtwarzacz YouTube po kliknięciu miniatury, a animacje w menu po najechaniu.","\u002Fprojects\u002F2026\u002Fpesi-pl\u002Fthumbnail.webp",{"live":97},"https:\u002F\u002Fpesi.pl",{},true,"Kod napisał Claude Code – ja planowałem całość, decydowałem o układzie i komponentach i sprawdzałem każdy widok. Wyniki „przed” zmierzone na kopii starej strony z archiwum internetowego.","\u002Fog\u002Fprojects\u002Fpesi-pl-pl.jpg","\u002Fpl\u002Fprojekty\u002F2026\u002Fpesi-pl",{"title":5,"description":65},[105,106,107,108,109,110],"WordPress","motyw blokowy","PHP","Three.js","CSS scroll-snap","bez jQuery","pl\u002Fprojekty\u002F2026\u002Fpesi-pl\u002Findex",[113],"wordpress","UskubPo44RZn0O_Tv81HWCCL8jcZtSpXbxxYXKxLtqw",[],1794588331269]