grodev@dev - skills

$ grodev build --usluga "agent-skills"

// czytam ciężką scenę three.js i wynik PageSpeed[ ok ]

// znajduję prawdziwy koszt: kompilacja shaderów w pierwszej klatce[ ok ]

// oddaję scenę, która robi 90+ bez zmiany wyglądu[ ok ]

Ciężka scena three.js z wynikiem 90+ w PageSpeed.

Skill dla agentów kodujących i deweloperów, który wie, gdzie naprawdę siedzi koszt ciężkiej sceny WebGL. Zbudowany na produkcyjnym ratunku, sprawdzony testem A/B.

// darmowa wycena → zobacz opiekę (SLA)

Masz na stronie prawdziwą scenę 3D, a PageSpeed karze Cię wysokim Total Blocking Time i długim zadaniem podpiętym pod gsap.min.js. Każdy poradnik każe ciąć cząstki albo wrzucić Web Workera. Oba ruchy są zwykle błędne. Ten skill mówi Twojemu agentowi dokładnie, co zrobić i w jakiej kolejności.

Liczby z produkcyjnego wdrożenia.

73 → 97

Wynik PageSpeed na komputerze, mediana z trzech pomiarów.

700 → 140 ms

Total Blocking Time po naprawie pierwszej klatki.

656 → 3-6 ms

Koszt pierwszej klatki sceny na maszynie Google.

7k → 72k

Cząstek na telefonie, napis ostry, wygląd komputera nietknięty.

Ten sam problem, agent bez skilla i z nim.

Skill sprawdziłem testem porównawczym: identyczny problem dostał ten sam agent raz bez skilla, raz z nim. Bez skilla powtórzył pięć klasycznych błędów. Ze skillem zniknęły wszystkie.

agent bez skilla

„Other 1155 ms to worek, nie goń tego" - a to była cała przyczyna
Profilowanie w DevTools na własnej karcie z ciepłym cache
Zatrzymanie się na samym compileAsync
Skalowanie promienia poświaty, które nic nie zmienia
Web Workery jako drugi ruch, czyli dzień pracy w złym miejscu

agent ze skillem

„Other" rozpoznane jako czekanie na kartę i skan pikseli
Pomiar w warunkach Google: bez GPU, świeży profil
compileAsync plus rozgrzewka 1×1 px z płotkiem fenceSync
Szerokość rozmycia z rozdzielczości bufora, nie z promienia
Kolejność zadań zamiast Web Workerów, wynik 73 do 97

Dlaczego działa na każdej scenie.

Skill nie jest przywiązany do jednej strony. Opiera się na tym, jak przeglądarka bez karty graficznej kompiluje programy cieniowania, a to zachowanie jest identyczne dla każdej sceny three.js i WebGL. Jeśli masz cząstki, bloom, post-processing albo animacje GSAP i wysoki Total Blocking Time, masz dokładnie ten wzorzec, który skill rozbraja. Metoda celuje w mechanizm, nie w wygląd konkretnej sceny. Dlatego przenosi się między projektami.

Co jest w pakiecie.

SKILL.md

Zasada, ośmiokrokowa procedura, tabela objaw → przyczyna → ruch oraz lista częstych błędów, które kosztują dzień pracy.

first-frame.md

Sedno naprawy z gotowym kodem: compileAsync we właściwym celu renderowania, rozgrzewka do płótna 1×1 px, płotek fenceSync i pułapka definicji OutputPass.

mobile-scaling.md

„Identycznie, tylko mniejsze" jako tabela wielkości, strażnik jakości i sposób pomiaru ostrości napisu na telefonie.

measuring.md

Protokół pomiaru: mediana z trzech, próg siedmiu punktów, kolejność diagnozy TBT i moment, w którym trzeba przestać.

pagespeed.py

Skrypt do PageSpeed Insights: zapisuje wyniki, liczy medianę z N pomiarów, wypisuje długie zadania i porównuje dwa pomiary.

Aktualizacje w cenie

Kupujesz raz, dostajesz kolejne wersje. Licencja jednostanowiskowa, z prawem użycia w pracy komercyjnej dla klientów.

Dla kogo to jest.

Dev z ciężką sceną WebGL. Masz konfigurator 3D, hero z cząstkami albo scenę z bloomem i post-processingiem, a PageSpeed świeci na czerwono, choć wszystko chodzi płynnie.

Ktoś, kto pracuje z agentem kodującym. Chcesz, żeby Claude Code albo Codex wiedział, gdzie naprawdę siedzi koszt, zamiast ciąć cząstki na oślep.

Agencja albo freelancer. Robisz strony z three.js dla klientów i potrzebujesz powtarzalnej metody na wynik PageSpeed, a nie zgadywanki przy każdym projekcie.

Szczerze: to jest wiedza z realnej walki z produkcyjną sceną, spisana tak, żeby nie trzeba było przechodzić tej drogi od nowa. Nie sprzedaję magii ani gwarancji wyniku, bo ten zależy od Twojej sceny, kodu i hostingu. Sprzedaję dokładną receptę i narzędzie pomiaru, które dały 73 do 97, oraz metodę, która przenosi się na inne sceny.

Ile to kosztuje.

Skill kupujesz na MCP Market za stałą cenę. Jeśli wolisz oddać robotę mnie, cenę optymalizacji podaję po obejrzeniu Twojej sceny.

Skill

19 USD

WebGL PageSpeed Rescue: SKILL.md, trzy referencje z kodem i skrypt pomiaru PSI. Aktualizacje w cenie.

Kolejne skille

wkrótce

Katalog rośnie wokół three.js, WebGL i wydajności frontu. Jeden storefront, kolejne pozycje.

Wdrożę u Ciebie

od 4 tys. zł

Audyt i naprawa wydajności Twojej sceny WebGL/three.js na Twojej stronie, z pomiarem przed i po.

Często zadawane pytania.

Skąd wiem, że zadziała na mojej scenie, a nie tylko na jednej?

Bo skill celuje w mechanizm, nie w konkretną stronę. PageSpeed mierzy bez karty graficznej i kompiluje programy cieniowania na procesorze tak samo dla każdej sceny three.js/WebGL. Jeśli masz cząstki, bloom, post-processing albo GSAP i wysoki Total Blocking Time, masz dokładnie ten wzorzec, który skill rozbraja.

Czym jest agent skill i jak go używam?

To pakiet instrukcji (plik SKILL.md z materiałami), który wczytuje się do agenta kodującego, na przykład Claude Code czy Codex. Kupujesz raz, wrzucasz do katalogu skilli albo synchronizujesz przez MCP Market Hub, a agent sięga po niego sam, gdy trafi na ciężką scenę WebGL i słaby wynik PageSpeed.

Dlaczego cięcie liczby cząstek nie pomaga?

Bo PageSpeed mierzy bez karty graficznej. Koszt to nie liczba cząstek, tylko kompilacja programów cieniowania w pierwszej klatce i wołania do sterownika, które czekają na odpowiedź. Cząstki są tanie, drogie jest wypełnianie i pierwsza klatka. Skill pokazuje, gdzie naprawdę siedzi czas.

Czy wyniki są prawdziwe?

Tak. Metoda powstała na produkcyjnym wdrożeniu z ciężką sceną three.js: komputer 73 do 97, Total Blocking Time 700 do 140 ms, pierwsza klatka 656 ms do 3-6 ms. Została też sprawdzona testem A/B: agent ze skillem i bez skilla dostał ten sam problem, a skill zdjął pięć klasycznych błędów.

Z jakimi agentami działa skill?

Z Claude, Codex i innymi agentami zgodnymi z MCP Market Hub. Plik SKILL.md jest zwykłym formatem tekstowym, więc zadziała wszędzie tam, gdzie agent czyta skille.

Wolę zlecić to Tobie. Ile to kosztuje?

Audyt i naprawę wydajności Twojej sceny WebGL/three.js robię od 4 tys. zł. Podeślij URL strony, a powiem wprost, gdzie siedzi koszt i ile realnie zdejmę. Cenę stałą podaję po obejrzeniu sceny, nie widełki.

Powiązane: konfigurator produktowy 3D i konfigurator stoisk targowych, gdzie ta sama wiedza o three.js pracuje na produkcji. Kto za tym stoi: o mnie.

// Ciężka scena three.js z niskim wynikiem w PageSpeed?

Kup skill i daj go swojemu agentowi albo sobie. Wolisz oddać robotę mnie? Napisz, podeślij URL sceny, a odpowiem w ciągu jednego dnia roboczego i powiem wprost, gdzie siedzi koszt i ile go zdejmę.

Kup skill na MCP Market → Zlecę optymalizację →

✓ Ciężka scena three.js z wynikiem 90+ w PageSpeed._