Devlog 4: passkeys, every layout, and browser support musings

It’s been a lot of behind-the-scenes work these past few weeks; the highlights are:

• I wrote a set of FAQs for questions I always get when talking about passkeys; which will definitely get reused for inevitable support questions
• I’m a sponsor for Kasper Timm Hansen’s Open Source Retreat. They’re working on a really exciting & revolutionary way to handle test data & keeping data in sync across environments, and I can’t wait to use it
• I finished the first experiments of using Every Layout for the Practical Framework, more on that below

After reading through Every Layout and writing some implementations, I think it’s going to work well! It’s definitely a mindset shift, and there’s a lot of new syntax to learn with logical properties. But once you wrap your head around it, it generally makes sense. I opted to skip a few of its components (The Imposter and The Reel), because I want to solve their problems differently, or don’t have an immediate need for them. I also opted to go the pure CSS/HTML route instead of Custom Elements; since that gives me more flexibility when it comes to implementation (not to mention a smaller JS payload!)

I’ve also been thinking about browser support. I think I’m landing on Safari 17+, Chrome 115+. The reasons for this are:

• Currently, Firefox & Ubuntu are no-gos, because they don’t support passkeys. Which sucks; but I can’t really do anything about that.
• There are 2 remaining APIs that browsers need to ship with for us to have full-fledged applications with minimal JS: the Popover API and Anchor Positioning. Safari 17+ will ship with the Popover API, and Anchor Positioning is still in working draft.
  • So I can include some basic anchor-positioning logic using Floating UI as needed; with the intent that it’ll be removed as soon as browser support gets there.
  • Since I’m still a ways off from the framework shipping, the target audience will be developers (who generally run newer browsers), and general adoption of the framework itself would be slow; this is a decent set of requirements that strikes a balance between shipping and not cramming in JS

Next up is continuing to work on the framework. The great thing about Every Layout is that it’s meant a lot less CSS and stuff generally “just works” by the nature of respecting the browser’s choices; so that’s a huge win!