Frontend Briefly - Novinky a postrehy zo sveta frontend vývoja #4

1. React 18 je tu!

Novú verziu React 18 nájdeš dostupnú na npm. Ak ťa zaujíma čo je v tejto verzii nové, tak si prečítaj na oficiálnom blogu Reactu článok, kde nájdeš prehľad noviniek. Je ich naozaj dosť napr: client a server side rendering API, množstvo nových hookov (useId, useTransition, useDeferredValue...), Suspense, podpora pre concurrency atď... Ak ťa skôr zaujíma ako upgradovať na najnovšiu verziu tak si prečítaj tento oficiálny návod.

2. Interop 2022

Prvý krát spojili sily všetky hlavné prehliadače, aby vyriešili problémy s kompatibilitou medzi prehliadačmi, ktoré trápili web developerov. Ak ťa zaujíma ako vznikol tento projekt a aké ciele si nastavili, tak si prečítaj článok Interop 2022: browsers working together to improve the web for developers.

3. CSS novinky pre rok 2022

Rok 2022 prináša veľa noviniek do CSSka. Niektoré už prehliadače začínajú podporovať a na niektoré si ešte musíme počkať. Ak ťa zaujíma prehľad týchto noviniek, tak na portáli CSS-Tricks nájdeš super článok. Ku každej feature je aj spomenutá podpora pre prehliadače, takže vieš čo už môžeš začať používať alebo načo sa môžeš pripraviť.

4. Novinky v novej verzii Safari 15.4

S viac ako 70 novinkami do WebKit-u prichádza nová verzia Safari 15.4. Ide teda o naozaj veľký release. Nájdeš tu napríklad podporu pre lazy loading obrázkov, <dialog> element, :has(), Cascade Layers, BroadcastChannel, nové viewport units atď... Ak ťa zaujímajú všetky novinky, tak si prečítaj článok: New WebKit Features in Safari 15.4 na blogu WebKit-u.

5. Niekoľko článkov o výkonnosti webu

Chris Coyier z portálu CSS-Tricks spísal prehľad aktuálnych článkov, ktoré sa venujú výkonnosti webov. Prečítať si ich môžeš v tomto článku: 7 Fresh Links on Performance For March 2022. Nájdeš tu napríklad osvedčené postupy na cachovanie alebo ako ešte viac zrýchliť Next.js framework.

Nezmeškaj svoju príležitosť. Do nášho Frontend tímu hľadáme nového parťáka!

6. Nový <selectmenu> element

Natívne štýlovanie formulárov patrí medzi top chýbajúce veci pre frontend developerov. V článku Say Hello to selectmenu, a Fully Style-able select Element ti Patrick Brosset predstaví nový (zatiaľ len experimentálny) element pre ovládanie formulárov <selectmenu>. Dozvieš sa o koľko je jednoduchšie štýlovať tento element oproti tradičnému <select> elementu.

7. CSS Custom Highlight API

CSS Custom Highlight API je nová špecifikácia W3C (momentálne v stave Working Draft), ktorá umožňuje upravovať ľubovoľné rozsahy textu pomocou JavaScriptu a následne ich naštýlovať pomocou CSSka. Viac si môžeš prečítať v tomto článku: CSS Custom Highlight API: The Future of Highlighting Text Ranges on the Web.

‍

8. Ako používať HTML a CSS v emailoch v roku 2022

Medzi prehliadačmi môžeme v posledných rokoch sledovať, že sú omnoho viac konzistentné z pohľadu podpory HTML, CSS a JavaScriptu. To isté však nemôžeme povedať o emailových klientoch. Prečítaj si čo môžeš používať v emailoch v roku 2022 v článku: HTML and CSS in Emails: What Works in 2022?

9. Prečo vyskúšať <dialog> element

<dialog> element sa prvýkrát objavil ešte v roku 2014. Avšak až teraz ho začínajú podporovať známe prehliadače ako napr. Safari alebo Firefox. Hlavnou myšlienkou tohto HTML elementu je uľahčiť vytváranie modálnych a kontextových okien. Pekný návod a prehľad o tomto elemente nájdeš v článku: A look at the dialog element's super powers.

Niekoľko článkov o prístupnosti

• The WebAIM Million - Report za rok 2022 o prístupnosti 1 000 000 domovských webových stránok. Výsledky poskytujú prehľad na súčasný stav o prístupnosti webov.
• A Designer’s Guide to Documenting Accessibility & User Interactions - Dobrá dokumentácia pomáha tímom implementovať požiadavky na prístupnosť správnym spôsobom. V článku nájdeš návod prečo, čo a ako môžu dizajnéri dokumentovať rôzne aspekty prístupnosti.
• WCAG 2.1 Map - Prehľadná mapa o špecifikácii WCAG 2.1 dostupná na stiahnutie.

Ďalšie články, ktoré stoja za prečítanie

• CSS-Tricks is joining DigitalOcean! - Aká je budúcnosť portálu CSS-Tricks ? Môžeme sa tešiť na nový a ešte lepší obsah?
• How to understand complex coding concepts better using the Feynman Technique - Ako sa naučiť a pochopiť aj veľmi komplexné témy.
• New to the web platform in February - Prehľad funkcií, ktoré sa dostali do stabilných a beta verzií webových prehliadačov počas februára 2022.
• Is HTML A Programming Language? - V diskusiách sa často ľudia hádajú, či je HTML programovací jazyk. Našli sme konečne odpoveď ?
• Building a loading bar component - Ako vytvoriť štýlovateľný a prístupný loading bar pomocou <progress> elementu.

Zhrnutie

Ak sa ti prehľad noviniek páčil, nezabudni sa prihlásiť na odber nášho newslettera. Prečítať si môžeš aj novinky za minulý mesiac, ktoré sme priniesli vo februárovom Frontend Briefly.