K Frontkonu jsme se letos vrátili už potřetí. S kolegou Honzou jsme si udělali výlet do Brna, oběd jsme si dali během přednášek a pak se ponořili do programu. Bylo to nabité novinkami, inspirací i praktickými tipy – a hlavně příjemné potvrzení, že směr, kterým vedeme naše projekty, dává smysl. Níže popisuju jen ty přednášky, na kterých jsem osobně byl – tedy to, co jsme skutečně viděli, zkusili a odnesli si do praxe.

CSS vs. Tailwind: dva světy, jeden cíl (Lukáš Trumm)

Lukáš odstartoval energií nabitým srovnáním „čistého“ CSS a Tailwindu. Rychlý průzkum v sále ukázal vyrovnané tábory – a to dobře ilustruje realitu: dnes už nejde o ideologii, ale o kontext a potřeby týmu.

V CSS 6 potěšily hlavně praktické novinky a standardizační iniciativa Baseline. V praxi zaujmou kaskádové vrstvy (cascade layers), selektory jako :where() a zejména :has(), které otevírá dveře interakcím dřív typickým pro JS. Na druhé straně Tailwind 4 přinesl slušný skok – je cca 3,5× rychlejší, nově víc dynamický a konfigurace se přesouvá do direktivy @theme. Zazněla i poctivá otázka: kde je hranice mezi rychlou tvorbou s utilitami a okamžikem, kdy je pro komponenty čitelnější vlastní CSS? Odpověď není univerzální – pomáhá sledovat State of CSS a vyhodnocovat stack podle typu projektu a seniority týmu.

JavaScript is dead? Sedmkrát „nahradí to CSS“ (Honza Svěrák)

Honza Svěrák (jansverak.cz) se pochlubil sadou čistě CSS technik, které jsou od roku 2024 spolehlivě použitelné a leckdy umí nahradit jednoduché JS skripty. Největší radost? Méně kódu, méně chyb, lepší výkon.

content-visibility: auto – odkládá layout/paint, ideální třeba pro taby či dlouhé stránky
scroll-snap-type – jednoduchý carousel se swipe/scroll chováním bez JS
text-wrap: balance – hezky vybalancované řádkování nadpisů
color-mix() – míchání barev přímo v CSS, rychlý design-tuning
:user-valid / :user-invalid – validace formulářů a stavy bez JS
scrollbar-gutter: stable – stabilní layout i se scrollbarem
a snadné centrování s moderním CSS (např. place-content: center)

Hodnota je dvojí: snazší údržba a lepší Core Web Vitals díky menším bundleům. JavaScript rozhodně „neumřel“, ale je fajn mu nepřidělávat práci, když to CSS zvládne samo.

TanStack Start vs. Next.js 15.5 (Ondřej Velíšek)

Ondra srovnal TanStack Start a Next.js bez fanboy brýlí. U routování boduje TanStack Router – 100% typesafe API a větší flexibilita. Next.js 15.5 s type routes se dotahuje, ale v developer zážitku při práci s routerem TanStack vede.

Načítání dat? V TanStacku dává smysl loader + useSuspenseQuery. Je to „o chlup“ pomalejší, ale ergonomické. Next je v některých scénářích rychlejší, nicméně může nutit k prop drillingu nebo vlastnímu state managementu tam, kde by si člověk přál něco integrovanějšího.

Rychlostně vítězí Next – server components a menší bundle prostě hrají roli. Start zatím server components nezná a generuje větší balík. Na druhou stranu caching strategie u Startu (request memory, data cache, router cache, full route cache / static prerendering) jsou promyšlené a pro silně interaktivní aplikace dává TanStack Start fakt smysl. Verdikt: na rychlost a SEO je dnes Next.js bezpečnější volba, na bohatou interaktivitu a typovou jistotu se nám líbil Start.

Vibe kódování (Martin Staněk)

Vibe kódování je domluva na „pocitu“ z kódu – na tom, jak by měl vypadat, číst se a chovat napříč projektem. Nejde jen o lint pravidla; je to mix design tokenů, naming konvencí, struktury složek, způsobu psaní komponent i toho, jak řešíme edge case. Cílem je, aby kdokoli z týmu mohl bezpečně sáhnout do kterékoliv části kódu a okamžitě „nasednout“.

Koncept v praxi znamená sjednocené primitives (barvy, spacing, typografie), jednotný slovník (např. Button/variant/intent/size), předem domluvené stavy (loading, error, disabled) a repo tooling, který to hlídá (lint-staged, pre-commit, testy, vizuální regresní testy). PR šablony a ukázkové „golden“ komponenty fungují jako vodítko.

Výhody jsou jasné: rychlejší onboarding, menší kognitivní zátěž, konzistentní UX, méně debat o detailech v code review a lepší škálování týmu. Nevýhody? Riziko „cargo cult“ (kopírujeme bez přemýšlení), potlačení experimentů a skryté vazby, které mohou ztížit refactoring. Klíč je nechat prostor pro „escape hatch“ – mít konvence, ale i vědomé výjimky, které zdokumentujeme. Pointa zůstává: standardy a sdílené konvence jsou násobič efektivity, ne svěrací kazajka.

Z rutiny k efektivitě (Petr Malík)

Petr rozebral, jak z rozdrobené každodenní práce udělat plynulý tok. Začíná to na osobní úrovni: timeboxing (bloky 60–90 min hluboké práce), jasné priority na den a přísná ochrana kalendáře. Následuje týmová hygiena – menší, čitelná PR (např. do 300 řádků), sdílená Definition of Done, CI, která spouští rychlé testy lokálně (pre-commit) a ty pomalejší v pipeline, a automatizace rutiny (generování changelogu, verze, deploy).

Důležitá je i rytmizace práce: krátké standupy s reálnými překážkami (ne report), async komunikace místo meetingů, review do 24 hodin a měření toku (lead time, cycle time). Nezapomněl na rizika – když to přeženeme, z malých PR se stane spam a pipeline se ucpe. Řešením jsou „work streams“ s jasným cílem a pravidelný úklid WIP. Výsledek? Méně kontextových přepínání, menší technický dluh a rychlejší dodávka bez pálení víkendů.

Vlastní appka s AI agenty: od nápadu k produkci

Zajímavý průchod procesem tvorby: idea → vizuál → AI Rules (např. v Cursoru) → nastavení AI agenta. Na dev/testing prostředí zaznělo Ollama, do produkce Hugging Face nebo OpenAI. Základní rozdělení modelů: „tradiční“ generativní vs. embedding pro vyhledávání podobnosti (cosine similarity). Klíčové je budovat feedback loop – zpětná vazba z uživatelského chování pomáhá agentům zlepšovat přesnost i UX.

Nue.js: break the limits of the web (Jan Černý)

Nue.js se představil jako minimalistický přístup: psaní v markdownu, výrazně menší syntax, a celkově stopa projektu „malá jako jedno Tailwind tlačítko“. K tomu nuekit (verze 0,1) a Bun jako kompilátor. Zpráva pro nás: sledovat. I kdyby Nue neskončil „mainstream“, filozofie „méně je více“ se dá přenést do jakéhokoli stacku.

„Jak jsem ukradl Frontkon“: brand a právo (Karel Navrátil)

Praktická (a vtipná) případovka o tom, jak snadno jde zneužít značku – a jak tomu předejít. Základní poučka: hlídat domény (i .com), registrovat profily na sítích, i když na nich momentálně nefungujeme, a řešit ochranné známky. Logo patří pod obrazovou ochrannou známku, obecně je dobré vybrat správné třídy (padly 35, 41, 42) a projít databázi ÚPV. Zazněla i orientační cena ~4 000 Kč a slibný checklist. Na závěr pobavilo lehké rýpnutí „frontkon.cz hacknout?“ – spíš jako memento, že prevence je levnější než řešení průšvihu.

Migrace Printables: z Angularu do Svelte (case study)

Velká databáze 3D modelů (1,1 mil.) a realita velkého refaktoringu. Původně Angular (externí integrace z roku 2018), první Svelte části v 2023, dojezd 2024. Důvod? DX v Angularu skřípala, SSR chybělo – řešili proto hackováním podle bota (uživatel viděl spinner, bot statiku), testování bolestivé. Rychlost kompilace u Svelte (Vite) přinesla úlevu, komponentový model byl Angularu blízký. Zajímavé: dnes by možná nemigrovali do Svelte; padl i Next.js (shodný stack s Prusa e-shopem) jako reálná alternativa.

AI pomohla s konverzí šablon (ChatGPT-4), ale před rokem úspora nebyla zázračná. „Dnes by to s agenty vypadalo jinak,“ padlo několikrát – a my souhlasíme. Odhad 6 měsíců se natáhl na 17 (z ~12 člověkoměsíců na ~22 + 2 měsíce bugfix). Problémy: SSR a autorizace (header vs. cookies), synchronizace refresh tokenu, složitější data loading. Se SvelteKit ocenili routování podle adresářů a možnost SSR zapínat/vypínat. Výsledek? Méně kódu, rychlejší načítání, lepší UI, silnější DX a lepší využití GraphQL. Plus praktická výhoda: stream změn a propisování dat v reálném čase.

CrUX, RUM a co (ne)říká Lighthouse

CruxVIS, pagespeed.cz a CrUX API ukázaly, jak prioritizovat výkon. Důležité připomenutí: Lighthouse skóre není rychlost webu. Díváme se na 75. percentil reálných uživatelů (RUM), syntetická měření bereme jako laboratorní signál a CrUX jako most mezi nimi. Hezká ukázka: LCP kazila cookie lišta – a stačila malá úprava, aby si reál zhluboka oddechl. Praktický závěr: nejdřív data, pak zásahy, a teprve pak honba za „100/100“ v Lighthouse.

3D na webu (Markéta Willis)

3D je cool – ale hlavně přináší jiný způsob uvažování. Základní stavebnice: scéna (objekty a světla), kamera, renderer (WebGL, GPU/CPU), geometrie (polygony) a materiál (povrch a interakce se světlem). Příliš detailní modely často potřebují prerender, jinak to real-time neutáhne; když to jde, sáhneme po real-time renderingu s WebGL. S three.js je start jednoduchý: dopočítáme scénu, kameru, renderer, a posíláme výstup do <canvas>. V produkci je zásadní pipeline optimalizace – od decimace polygonů po lazy loading assetů.

AI v programování jako nový default

Letošní Frontkon měl společného jmenovatele: AI v programování. Minimálně polovina přednášek se jí dotýkala – od využití agentů v produkci, přes asistenci při migracích, až po to, jak nám moderní CSS a nástroje zmenšují prostor, kde bychom dřív sáhli po JS nebo vlastním kódu. AI se stává „defaultní“ součástí vývojového procesu: pomáhá s návrhem, testy, dokumentací i snižováním technického dluhu. Neznamená to slepě nasazovat modely všude – spíš chytře rozhodovat, kde AI přináší byznysovou hodnotu, rychlost a kvalitu.

Za nás skvělý ročník. Potvrdil kurz, který jsme si nastavili, a přidal spoustu praktických tipů, co můžeme zítra použít v projektech – od :has() a content-visibility přes caching strategie až po CrUX-first přístup k výkonu. Díky všem řečníkům a organizátorům – a příští rok to prosím v Praze, ať netrávíme hodiny v koloně na D1. 😊