Together with  Posthog
🚀 Frontend Focus

#​655 — August 7, 2024 | Read on the web

Is It Time To Talk About “CSS5”? — The W3C CSS-Next community group is actively searching for better approaches for how we describe the evolution of CSS over time and identify feature sets as effectively as we did with CSS3 way back in 2009.

Brecht De Rutte

The Art of Dithering and Retro Shading for the Web — A lot of time spent building a striking effect for the Web has turned into an equally fantastic deep dive on the concepts around rendering graphical effects using shaders. This is advanced stuff, but it’s great to know it’s possible.

Maxime Heckel

The First Newsletter Dedicated to Product Engineers — The fastest growing startups increasingly rely on product engineers. These are engineers with the skills to figure out what to build. Product for Engineers is dedicated to sharing the skills and strategies needed to succeed in this role.

PostHog sponsor

The EU's 'AI Act' is Here — Not particularly frontend focused, but this EU legislation could well have far reaching ramifications. The Artificial Intelligence Act is the first-ever legal framework on AI, attempting to address its risks along with positioning Europe as a leader in AI legislation.

Alvaro Montoro

⚡️ Quick Links

📙 Tutorials, Articles & Opinion

Video with Alpha Transparency on the Web — Native ways of tackling rendering video with transparency are said to be “inefficient and buggy”, but Jake has a solution (and a ~2kB npm package to boot).

Jake Archibald

What If You Used Container Units For… Everything? — An interesting experiment, but Chris notes “that it’s not that easy. There are plenty of things that container queries are awkward at or just not the right unit for”.

Chris Coyier

HTML Web Components Make Progressive Enhancement And CSS Encapsulation Easier — A look at three specific examples that show off key features of Web Components, including CSS style encapsulation and opportunities for progressive enhancement.

Kev Bonett

Tests Are Dead. Meticulous Is Here — Automatically creates & maintains E2E UI tests. Zero flakes. Backed by YC, CTO of GitHub, CPO of Adobe, CEO of Vercel.

Meticulous sponsor

▶  3D Scene → Object → Chicken: A Complete 3D CSS Guide — A new video series looking at creating 3D scenes and objects with CSS.

Julia Miocene

Browsers, Cookies and Surfing the Web: The Quirky History of Internet Lingo — As new technologies develop, we adopt words or create novel ones to fill in the linguistic gaps.

ERICA BROZOVSKY

▶  Should Your Website Work Without JavaScript?
Syntax

Assistive Technology Is More Than Screen Readers
Adrian Roselli

Reading from the Clipboard in JavaScript
Raymond Camden

📰 Classifieds

🟪 MultimodalSlides.com can convert your PowerPoint content into a Multimodal website.

🔧 Code, Tools & Resources

Learn Web Components — If you’re looking to scrub on your web components know-how, this road map should prove useful. It’s a curated collection of third party articles covering a wide range of related knowledge.

Andrico Karoulla

Calendar Link: Dynamically Generate Event Links for Calendars — Generate event links for Google Calendar, Yahoo Calendar, Outlook, etc.

Anand Chowdhary

Build Better Forms, Faster and Without Manual Coding — With the SurveyJS form library suite, you can set up a user-friendly form management platform fully integrated into your JS app in just a matter of days.

SurveyJS sponsor

Whirl: A Unique Library of CSS Loading Animations — Not a new tool, but we’ve never featured it before. It includes a little over 100 animations, many of which you likely won’t find in similar libraries. GitHub repo.

Jhey Tompkins

SVG Viewer: View, Edit, and Optimize SVGs — A powerful little web app with options to optimize, prettify, rotate, flip, change dimensions, and convert the SVG to React, React Native, PNG, or even different types of data URIs.

SVG Viewer

Formatify: Free Client Side Media Conversion on Any Device — Upload any type of media file for a quick and simple way to convert to different formats, including 12 different image formats, 16 video, and 7 audio.

roktim

⚙️ ...and finally

A Rube Goldberg HTML Form — A fun, complicated chain-reaction HTML machine in the Rube Goldberg style. Just start typing into the form fields to watch it kick into.. gear.

Ksenia Kondrashova

Ipx.