Schématik δ: Update po 10 letech

Schématik je jedna z nejstarších věcí, kterou mám pořád on-line.

Pustil jsem ho v roce 2016 na Symfony 3.1 a PHP 5.5 a od té doby jsem v něm nezměnil jediný řádek. Ani jednou. Deset let běžel sám a hrálo ho cca 130 lidí. V srpnu 2026 jsem ho přepsal celý od nuly.

Osm otázek k tomu, jestli přepisovat nebo refaktorovat, tady na blogu mám a odpověď z nich skoro vždycky vyjde „refaktoruj“. Zde jsem se rozhodl pro přepsání. Hlavně abych si otestoval aktuální schopnosti AI. Což si vždy zkouším na svých „sranda“ projektech.

Co to je Schématik?

Dostanete technické schéma, tedy mřížku linek s písmenky. Na každé lince je na začátku tvar, cestou projde všemi znaky na té lince a na druhém konci z ní vyjede změněný. Úkolem je říct, co který znak dělá.

Úkonů je šest: prohodí barvy, zmenší, zvětší, přidá vodorovnou čáru, přidá svislou čáru, otočí o 90°. Jeden znak dělá na celém schématu pořád totéž, takže co se nedá poznat z jedné linky, prozradí druhá. Jedna špatná odpověď hru ukončí. Malinko se to podobá sudoku.

Je to zdarma a bez registrace na schematik.katuscak.cz.

Jak vypadala verze z roku 2016?

Stála na tehdy celkem běžné kombinaci: Symfony 3.1, Doctrine 2.5, Bootstrap 3 a jQuery 2. Vzhled hry byl velmi jednoduchý.

Úvodní stránka v roce 2016.

Úvodní stránka v roce 2026.

Všimněte si toho žebříčku vpravo. Ukazoval pět nejlepších výsledků, ne pět nejlepších hráčů, takže v něm jeden vytrvalý člověk seděl čtyřikrát.

Ve složce web/assets/ leželo 1 046 souborů AdminLTE (CSS sada stylů), Bootstrapu a jQuery pluginů. Hra z toho používala tabulku, formulář a postranní panel.

Vlastního kódu bylo naopak dost málo. Šestačtyřicet souborů PHP a Twigu, dohromady 3 304 řádků.

Proč jsem to přepsal a nezrefaktoroval?

I kdybych to nedělal přes AI, tak bych si stejně vybral cestu kompletního přepsání.

• Kódu byly tři tisíce řádků. To se dá přečíst za odpoledne. Argument „nikdo neví, co všechno ten kód umí“ tady prostě neplatil, protože jsem si to mohl celé projít.
• Testy nebyly žádné. Refaktoring bez testů je hádání. Napsat testy na PHP 5.5 kód, který stejně celý zahodím, mi přišlo jako práce navíc.
• Cesta ze Symfony 3.1 na 8.1 vede přes všechny mezistupně. Přepsat to znovu bylo kratší.
• Nikdo na tom nevisel. Žádný zákazník, žádné peníze, žádná SLA. Riziko rewritu je skoro celé v tom, že něco rozbijete lidem, kteří to potřebují. Tady nebylo komu.
• Cenu měla jenom data. Sto sedmdesát hráčů, 2 330 schémat, 774 odehraných kol a 127 výsledků. To bylo jediné, co jsem nechtěl ztratit, a to se dá zachovat nezávisle na tom, co se stane s kódem.

Mimo to tam byla i spousta chyb. (Špatně to počítalo čas ve vyšších levelech například.)

Změny

Rozložení zůstalo stejné, tedy vlevo schéma a vpravo odpovědi. Změnilo se, čím se odpovídá, abych trochu zjednodušil použitelnost.

Kolo hry v roce 2016.

Kolo hry v roce 2026.

Stará verze nabízela rozbalovací seznam českých frází: „přidá horizontální linku“, „otočí o 90 stupňu“. Nová verze nabízí rovnou obrázky. Každá volba je trojúhelník před a po, vykreslený tím samým rendererem, který kreslí desku. Slovní popisek se ukáže, až když si volbu vyberete.

Trojúhelník tam není náhodou. Je to tvar (jako ještě například hvězda), na kterém je vidět všech šest úkonů. Otočené kolečko vypadá jako neotočené a hráč by dostal na výběr možnost, která zdánlivě nedělá nic.

Odpočet ve staré verzi byl nadpis v postranním panelu. Dneska je to tenká linka přes celou šířku okna, která ubývá, a k tomu číselný údaj v rohu. Je pořád v periferním vidění a nikdy v cestě.

A konec hry. Stará verze napsala „Udělal jsi chybu!“ a počet bodů. Nikdy neřekla, co bylo správně, takže hráč odešel se stejnou neznalostí, s jakou přišel. Nová verze ukáže poslední schéma i s řešením, tedy nakreslené, co dělal každý znak. Výsledek má navíc vlastní odkaz, který jde poslat komukoli.

Jak si s tím AI poradilo?

Vlastně mě celkem překvapilo jak moc dobře. Ani jsem nevymýšlel nějaký složitý prompt. Celé se to událo na příkaz do Claude Code (Opus 5, Max + Chrome MCP):

Aktualizuj tak, aby to fungovalo na PHP 8.5, na nejnovějším Symfony 8. 
Udělej tomu moderní hezký design. 
Optimalizuj i pro mobily. Když tě napadne jak to vylepšit, tak to rovnou udělej. 
Desktop i mobil otestuj reálnými průchody přes Chrome MCP. 
Na nic se mě neptej.

/goal Plně otestovaný v Chrome MCP a dokončený k dokonalosti. Musíš dát ruku do ohně, že to je absolutně kompletně hotové.

Pak to běželo cca 2 hodiny. Prošel jsem si nový kód a vlastně jsem k němu neměl moc výhrady. Funkčně to vypadá taky velmi dobře. Co se mi nelíbilo v textech nebo designu (byly to jen kosmetické věci), to jsem si doladil ručně a za další 2 hodiny bylo hotovo.

Stará vs nová verze

Shrnutí

Přepis deset let staré aplikace dává smysl v poměrně úzké situaci: kódu je málo, testy nejsou, nikdo na tom nevisí a data se dají zachovat zvlášť. Schématik do ní sedl přesně a u zákaznického projektu bych se takhle rozhodl málokdy.

Odkaz na hru: schematik.katuscak.cz