Café Lajka 13. 05. 2026

Brno dnes: Artin
příště: 10. června, CDN77

note:

• v Brně: Martin Omacht, Artin: Budeme ještě frontendisti?
• představit spolek

  Budujeme a vzděláváme komunitu frontendových vývojářů a designérů

• organizační náležitosti
• Vítáme nové spíkry! Máš-li zajímavé téma nebo případovku, nenechávej si ji pro sebe. Call for papers AKA náležitosti na webu Frontendisti.cz

WWWýhledově

Frontkon: workshopy

5. října

• Petr Glaser
  AI ve vývoji bez omáčky: od neznámé codebase po debugging a testy
• Manuel Matuzović
  Accessibility v Reactu: Od teorie k funkčnímu kódu
• Michal Matuška
  WebPerformance v Chrome DevTools: ponoř se do hloubky

note:

• workshopy den před FrontKonem – konference 6. října (i když někteří šíří fámy – Máchal: 10. října)
• lze stihnout i 2 (v určitých kombinacích)

WWW minulém díle jste viděli

FrontKec

• Riki Fridrich – Co říkají výsledky State of JavaScript/React 2025
• Robin s Martinem o AI, filozoficky i prakticky

Frontendisti.cz na YT

• Martin Michálek – Proč vám váš CEO bere práci?
• Marek Velas – 7 klíčových kompetencí vývojáře v době AI

note:

• Riki: začátek dubna; State of AI
  • State of… ~ horoskopy pro vývojáře
• AI: návaznost na dubnový sraz (vibecoding v rukou netechnických profesí; programátorský vkus)
• ideální pořadí: Máchal, Marek, FrontKec

Letem swwwětem

Prohlížeče

Firefox 150
vydán 21. dubna 2026
Chrome 148
vydán 22. dubna 2026
Safari 26.5
vydáno 11. května 2026

note:

• SF konečně umí :open
• CH at-rule v @supports()

Web platform status

běžně dostupné: 5/2026

• :user-valid & :user-invalid
• isWellFormed() & toWellFormed()

note:

• běžně dostupné (widely available): 2,5 roku od chvíle kdy fičuru implementoval poslední z trojice CH, FF, SF
• a pár dalších specifických vlastností, žeň přijde v červnu

nově dostupné: 5/2026

.sidebar {
  container-name: sidebar;
}

.card {
  display: grid;

  @container sidebar {
    grid-auto-flow: column;
  }
}

note:

• nově dostupné: aktuální verze CH, FF, SF podporují
• z přehledu od Adama Argyla
  • Chris Coyier: Name only containers: The scoping we needed
    • vymezit scope
    • totéž co @scope() jediný rozdíl, že si můžete kontejner pojmenovat

nově dostupné: 5/2026

• contrast-color()
• shared workers vč. modulů,
  tj. SharedWorker() umí { type: "module" }

note:

• contrast-color() vrátí kontrastní barvu k zadané

omezená dostupnost: 5/2026

• @supports at-rule(@starting-style)
• "sizes=auto"

<img
  loading="lazy"
  src="TrIZjHKy9-650.jpeg"
  srcset="GTrIZjHKy9-650.jpeg 650w,
          GTrIZjHKy9-960.jpeg 960w,
          GTrIZjHKy9-1400.jpeg 1400w"
  sizes="auto,
         (min-width: 1040px) 650px,
         calc(94.44vw - 15px)"
  alt="…">

note:

• dostupné jen v některých prohlížečích
• sizes="auto": CH146, FF150, SF241Techpreviw
  • The end of responsive images

omezená dostupnost: 5/2026

<video
       loading="lazy"
       src="https://frontendisti.cz/nowwwinky.webm"
       controls>
</video>

note:

• CH148; více o líném videu
• i <audio>

omezená dostupnost: 5/2026

Prompt API

• Mat Marquis: Google’s Prompt API

Žádný webový standard by neměl obsahovat povinný souhlas s obchodními podmínkami reklamní společnosti.

note:

• Chrome na pozadí stáhne 4GB Gemini Nano (smažete-li, obnoví si ho)
  • každá stránka, kterou navštívíte ho může úkolovat
• Matthias Ott: Lazy and Prompt
• Jake Archibald
• FF i SF odmítli

Zachyceno v síti

Jon Shamir: Animated dark mode transition with modern CSS

note:

• Jon Shamir porovnává 2 přístupy jak animovat přepínání témat
  • transition
  • view-transtion

Roman Komarov: Pure CSS Mixin for Displaying Values of Custom Properties

note:

• mixin zobrazovat jen na vlastní nebezpečí

Petice za návrat poznámek pod čarou

note:

• původně v HTML3

HTML uvnitř <canvas>

KoutPen

Adam Argyle: Moderní <select>

note:

• článek rozepisuje použité vlastnosti (vč. podpory v prohlížečích)

Dnes wwwečer

• Petr Koláček, Etnetera core
  Obsidian + Claude Code = web accessibility
• Risk{f}uj!

note:

LLM ≠ AI

Díky, prezentace v komentáři na Meetup.com

note: