--- title: "💔 Apple and PWAs: It's not me, it's EU.." publication: "Frontend Focus" issue: 630 published_at: "2024-02-14" canonical_url: "https://frontendfoc.us/issues/630" --- Plus a neural network in pure CSS, and Mozilla shifts focus to AI. | Together with [![Hookdeck\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_1417,h_228/e_make_transparent/co_white,e_outline:15/inbujhb9yc9paku133a6.png)](https://hookdeck.com?ref=frontend-focus-630) 🚀 **Frontend** Focus #​630 — February 14, 2024 | [Read on the web](https://frontendfoc.us/issues/630) [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1707916180/ughm5gvojkozzzc9xihs.jpg)](https://www.theregister.com/2024/02/08/apple_web_apps_eu/) [Apple 'Broke' Web Apps in iOS 17 Beta; Still Hasn't Fixed Them](https://www.theregister.com/2024/02/08/apple_web_apps_eu/) — There’s been [plenty of chatter](https://www.wired.com/story/developers-revolt-apple-dma/) about App Store changes, and PWAs in iOS 17 this week — all coming as a result of upcoming EU enforcement of the _Digital Markets Act_. [This PWA bust](https://www.macrumors.com/2024/02/08/ios-17-4-nerfs-web-apps-in-the-eu/) is a change in the current beta, and the overall deadline for DMA compliance is in March — so things may change yet, but right now [it’s not looking great](https://twitter.com/firt/status/1755406923485122615) for all things PWA on iOS for those in the EU. Thomas Claburn [![\](https://copm.s3.amazonaws.com/0a19535a.png)](https://hookdeck.com?ref=frontend-focus-630) [Managed Reliability & Observability for Webhooks & Async Events](https://hookdeck.com?ref=frontend-focus-630) — Receive, verify, authenticate, transform, filter, route, rate limit, and deliver asynchronous messages at scale between third-party services and serverless functions with the Hookdeck Event Gateway. [Try Hookdeck for free](https://hookdeck.com?ref=frontend-focus-630). Hookdeck sponsor [CSS Mixins & Functions Explainer](https://css.oddbird.net/sasslike/mixins-functions/) — Following a recent [update from the CSS Working Group](https://twitter.com/LeaVerou/status/1757167038210961501), Miriam captures the overall state of the conversation on developing CSS-native mixins and functions, including looking at how they would differ from existing pre-processors, and what extra functionality (or limitations) could come with such a browser level approach. A thorough, detailed overview. Miriam Suzanne [Mozilla Downsizes As It Refocuses on Firefox and AI](https://techcrunch.com/2024/02/13/mozilla-downsizes-as-it-refocuses-on-firefox-and-ai-read-the-memo/?guccounter=1) — With [a new interim CEO](https://blog.mozilla.org/en/mozilla/a-new-chapter-for-mozilla-laura-chambers-expanded-role/) in place, Mozilla is making some major changes to its product strategy, including bringing “_trustworthy AI into Firefox_” 🤨. Frederic Lardinois (TechCrunch) ⚡️ Quick Links - 🧡 As it's Valentine's Day, [here's a web component to show hearts on your site](https://utilitybend.com/blog/a-valentines-day-special-a-web-component-to-show-hearts-on-your-website/). - 💵 The Chromium team is [experiementing with Web Monetization again](https://www.theregister.com/2024/02/13/google_micropayments_plan/). - 🗺️ The OpenStreetMap project is [introducing vector tiles this year](https://blog.openstreetmap.org/2024/02/11/2024-announcing-the-year-of-the-openstreetmap-vector-maps/), a "_significant advancement in how map data is processed and presented_". - 🧭 Did you know that Safari, back in 2006, was [the first browser to ship developer tools](https://front-end.social/@jensimmons/111897481899585251)? 📙 **Tutorials, Articles & Opinion** [The Performance Inequality Gap in 2024](https://infrequently.org/2024/01/performance-inequality-gap-2024/) — Just how much HTML, CSS, and JavaScript can we afford to use in our projects? Alex digs in and notes that the answer is “_more than in years past, but much less than frontend developers are burdening users with_”. Alex Russell [Things Frequently Heard in My Beginning Frontend Web Development Class](https://www.smashingmagazine.com/2024/02/frequently-heard-beginning-front-end-web-development-class/) — What could we learn from entry-level students in frontend web development? Geoff opines that it's newcomers to the space who ask the most intriguing questions and who make “_connections that those of us who have spent years on the front end may have never considered_”. Geoff Graham [Tuple 'Makes Pair Programming with Co-Workers and Friends Fun Again'](https://tuple.app?utm_source=cooperpress&utm_medium=newsletter&utm_campaign=Q1_2024&utm_content=FrontEnd+Focus_Sponsored+Link) — Try Tuple for free and find out why staff engineers at Figma can't stop talking about Tuple. Tuple sponsor [Can Generative AI Help Write Accessible Code?](https://tetralogical.com/blog/2024/02/12/can-generative-ai-help-write-accessible-code/) — An experiment in asking three, free generative AI tools (Gemini, ChatGPT, and Fix My Code) some typical questions about accessible code. Léonie Watson [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1707909391/qditxkcdxljs4y90vuau.png)](https://danielcwilson.com/posts/mathematicss-powers/) [The New CSS Math: `pow()`, `sqrt()`, and Exponential Friends](https://danielcwilson.com/posts/mathematicss-powers/) — These CSS functions are now available in the latest versions of Chrome, Edge, Firefox, and Safari. The `pow()` function mirrors the `Math.pow()` JavaScript functionality (for specifying how many times to multiply a number by itself). The `sqrt()` function is for finding the square root of a number. Dan shares details on these, where you might use them, and more. Handy stuff. Daniel Wilson [How I Solved My Font Rendering Problem](https://css-irl.info/how-i-solved-my-font-rendering-problem/) — A quick fix for a variable font rendering issue on iOS. Michelle Barker [Nested Dark Mode via CSS Proximity](https://jwdallas.com/posts/nesteddarkmode/) — Jonathan notes that ‘inheritance’ is probably the more accurate title here, but ‘proximity’ helped them define the concept better. Jonathan Dallas [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/v1707909612/a1r9gd3grcjkcowbjdjb.png)](https://brutalist-web.design/) [Brutalist Web Design](https://brutalist-web.design/) — Guidelines for web design that adhere to the tenets and ethos of _brutalism_ — a term more often associated with architecture. However, David notes that it can apply to other forms of construction, including web design. David Copeland [How Many Bytes Is "Normal" for a Web Font: A Study using Google Fonts](https://www.phpied.com/bytes-normal-web-font-study-google-fonts/) Stoyan Stefanov [How to Fix the Invisible Scrollbar Issue in iOS Browsers](https://frontendmasters.com/blog/how-to-fix-the-invisible-scrollbar-issue-in-ios/) Šime Vidas [How to _Favicon_ in 2024: Six Files That Fit Most Needs](https://evilmartians.com/chronicles/how-to-favicon-in-2021-six-files-that-fit-most-needs) Andrey Sitnik 🔧 **Code, Tools & Resources** [Velvette: Making It Easier to Author CSS View Transitions](https://github.com/noamr/velvette) — A small library that adds some features ostensibly missing from the _View Transitions API_ (i.e. temporary classes during transition, unique name generation, and others). Noam Rosenthal [CheerpJ 3.0: A WebAssembly JVM to Run Real-World Apps in the Browser](https://labs.leaningtech.com/blog/cheerpj-3.0) — CheerpJ 3.0, a state-of-the-art WebAssembly JVM that runs real-world Java applications in the browser, is now available, although note that it’s a commercial project (but free for personal use). Leaning Technologies [Open-Source Form Builder to Generate Dynamic JSON-Driven Forms Right in Your App](https://surveyjs.io/?utm_source=frontend_focus&utm_medium=email) — Integrate SurveyJS client-side form libraries in any JS app. Build forms in a no-code UI and maintain full control over the data flow. SurveyJS sponsor [Tailwind CSS Button Collection: Click-to-Copy Animated Buttons](https://buttons.ibelick.com/) — A gallery of more than 60 hover, click, and loading button effects built using Tailwind classes, some simple and others more unconventional. Julien Thibeaut 🕰️ ICYMI (_Older links, still worth checking out_) - [This case study compares two identical site designs](https://nuejs.org/blog/tailwind-vs-semantic-css/): one using Tailwind, another created with semantic CSS. The difference in markup is remarkable. - Manuel Matuzović shares an idea of how we can [remove styling on a list _without_ affecting semantics](https://matuzo.at/blog/2023/removing-list-styles-without-affecting-semantics). - [Here's how to load your site step-by-step](https://www.debugbear.com/blog/load-website-step-by-step), pausing the load to inspect things at each stage. - Chuck Grimmett ponders 'digital legacy', questioning [how we can keep domains working long after we're gone](https://cagrimmett.com/2023/11/04/domain-longevity/). 🤖 ...and finally [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/nce7pqfygn06pgs03f4k.jpg)](https://codepen.io/bali_balo/pen/gOqEmgG) [CSS Neural Network (Number Detection)](https://codepen.io/bali_balo/pen/gOqEmgG) — This is kinda wild, and it feels like magic (but really it's just _math!™_). You 'draw' in a number and the output updates with its best guess ([▶️ Quick video demo](https://twitter.com/BaliBaloPG/status/1733273359540953146)). It didn’t work in Safari for me, but seems ok elsewhere. _(The true 'magic' here is in the use of SCSS to create a lot of boilerplate – well worth looking through, and then looking at the resulting CSS in DevTools.)_ Bali Balo 📬 **Got a new email address?** You can [change your email here](https://frontendfoc.us/edit_subscription/*|UID|*). --- **Bored of us?** Click [here to stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*). --- **Got a link for us?** Reply and tell us. We can't include everything but we'll take a look. --- Published by Cooper Press Ltd. Curated by [Chris Brandrick](https://mastodon.social/@brandrick) & [Peter Cooper](https://twitter.com/cooperx86). Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom [Stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*) [Ipx.](https://frontendfoc.us/open/630/*|UID|*?ipx=t)