Your weekly reading (and viewing) from Web Directions
This week we released the videos from the ‘front of the front end’ track at Web Directions Developer Summit, on the heels of the recent keynote videos.
All are available to Conffab Pro members (that’s just $19.95 a month or $195 a year), alongside nearly 1,000 presentations from past Web Directions (and other) conferences.
But for our wonderful readers, we’ve got two of these to watch right now, no signup required!
CSS:has(.everything)
Anton Ball
Anton Ball explores the latest and most interesting CSS advancements coming to browsers, including CSS Layers, new selectors like the parent selectors (:has), new color functions, layout modes and more.
Native modals with the new popover API
Zach Jensz
Elements that ‘popover’ the contents of a page–dialog boxes, tooltips, modals, menus, and notifications have always been a lot of work to get right. But with the new HTML popover element it’s got a whole lot easier.
Now on with the reading!
This week a real mix of content, from JavaScript and TypeScript to CSS, with plenty of AI in the mix.
How to write exceptional documentation
Writing high-quality developer documentation is a challenging task. One reader visiting your site may have a tricky bug to solve, another may be looking for guidance, while a third just wants to get started. Plus, everyone has their own unique blend of experience and learning preferences—how do you cover all this in your docs?
This is my personal approach to crafting holistic, comprehensive documentation that prioritizes developer experience and meets the needs of all.
Source: How to write exceptional documentation | Chris Nicholas | Developer experience at Liveblocks
I’ve written my fair share of documentation in my time, and read orders of magnitude more. It’s vital, and not usually considered glamorous. Here Chris Nicholas from Liveblocks provides some thoughts on how to do it well.
From Design doc to code: the Groundhog AI coding assistant (and new Cursor meta)
Today, alongside with teaching you the technique I’m announcing the start of a new open-source (yes, I’m doing this as pure OSS and not my usual proprietary licensing) AI headless agentic coding agent called “groundhog”.
Groundhog’s primary purpose is to teach people how Cursor and all these other coding agents work under the hood. If you understand how these coding assistants work from first principles, then you can drive these tools harder (or perhaps make your own!).
Source: From Design doc to code: the Groundhog AI coding assistant (and new Cursor meta)
We’ve cited Geoff Huntley a couple of times in recent weeks and he’s just announced a new AI headless agentic coding agent called “groundhog”. I’m still a little skeptical (this seems to put me in a minority right now) about how ‘agentic’ agents might be in the coming months (my experience with all manner of tools for code generation is they tend to drift over time and need to be corrected and nudged back toward the right focus, but the entire field of AI Engineering seems to think otherwise so…) but I’ll certainly be giving this a look at.
Functions in CSS?!
What exactly is a function in CSS?
I like this definition from the spec:
Custom functions allow authors the same power as custom properties, but parameterized
They are used in the same places you would use a custom property, but functions return different things depending on the argument we pass. The syntax for the most basic function is the @function at-rule, followed by the name of the function as a + ()
Source: Functions in CSS?! | CSS-Tricks
As we’ve observed before we generally focus on things that are broadly possible now at Conffab, but some things are potentially so impactful that we like to get out in front of them even if they’re not quote ready for primetime. CSS functions are one such thing–and they are even available behind flags in Chrome to experiment with. Learn more with Juan Diego Rodríguez at CSS Tricks.
The Modern CDN Means Complex Decisions for Developers
Whether you were building a web site or an application, hosting choices used to be about bandwidth, latency, security and availability (as well as cost), with content delivery networks (CDNs) handling static assets and application delivery networks relying on load balancing for scale.
All those things still matter, but there are also many more choices to take into account — from the backend implications of frontend decisions, to where your development environment lives. CDNs have become complex, multilayer distributed computing systems that might include distributed databases, serverless functions and edge computing. What they deliver is less about static (or even dynamic and personalized) assets and more about global reach, efficiency and user experience.
Source: The Modern CDN Means Complex Decisions for Developers
Mary Branscombe at the New Stack looks at the modern CDN, which do much more than deliver large static assets quickly.
AI vs The Expert
Eleven years ago, comedy sketch The Expert had software engineers (and other misunderstood specialists) laughing to tears at the relatability of Anderson’s (Orion Lee) situation: asked to do the literally-impossible by people who don’t understand why their requests can’t be fulfilled.
Source: AI vs The Expert – Dan Q
Dan Q approaches numerous LLMs with an impossible programming challenge, first found in a satirical Youtube video from a decade ago. How do the models respond? A fun idea but also instructive.
My sales pitch for TypeScript
Roughly, TypeScript is JavaScript plus type information. The latter is removed before TypeScript code is executed by JavaScript engines. Therefore, writing and deploying TypeScript is more work. Is that added work worth it? In this blog post, I’m going to argue that yes, it is. Read it if you are skeptical about TypeScript but interested in giving it a chance.
Source: My sales pitch for TypeScript
Hot on the heels of his recent ‘What is TypeScript? An overview for JavaScript programmers‘ Axel Rauschmayer has a sales pitch for TypeScript. I’ll confess, the scale at which I use JavaScript (not for full scale apps, but relatively small pieces), and with an aversion to build steps and the like, TypeScript is likely overkill for my purposes. But for many it’s become essential. There are proposals at TC39, the standards organisation for JavaScript to introduce type annotations into JavaScript itself, but these are still far off at this stage.
Hallucinations in code are the least dangerous form of LLM mistakes
A surprisingly common complaint I see from developers who have tried using LLMs for code is that they encountered a hallucination—usually the LLM inventing a method or even a full software library that doesn’t exist—and it crashed their confidence in LLMs as a tool for writing code. How could anyone productively use these things if they invent methods that don’t exist?
Hallucinations in code are the least harmful hallucinations you can encounter from a model.The real risk from using LLMs for code is that they’ll make mistakes that aren’t instantly caught by the language compiler or interpreter. And these happen all the time!
Source: Hallucinations in code are the least dangerous form of LLM mistakes
I definitely find the LLM tools I use hallucinating APIs, and solutions to problems I’m attempting to work with them to solve. It feels this is happening less over time. Here Simon Willison observes that these are among the least problematic of situations for hallucination.
Notes from my Accessibility and Gen AI podcast appearence
I actually use Large Language Models for most of my alt text these days. Whenever I tweet an image or whatever, I’ve got a Claude project called Alt text writer. It’s got a prompt and an example. I dump an image in and it gives me the alt text.I very rarely just use it because that’s rude, right? You should never dump text onto people that you haven’t reviewed yourself. But it’s always a good starting point.
Source: Notes from my Accessibility and Gen AI podcast appearence
After last week’s thought from Drupal founder Dries Buytaert on the topic, more thoughts on using LLMs to generate alt text, this time from Simon Willison.
Building a Unified Web: A Fireside Chat with Rachel Andrew
We chat with Rachel Andrew of Google — a leading voice in web standards and innovative design and a member of the CSS Working Group of the W3C – about the current and future state of web standards and browser compatibility. Some key topics will be the Baseline initiative to clarify browser support for web platform features and Interop 2025, an initiative focused on enhancing interoperability across browser engines.
Source: Youtube
One of our favourite past speakers, Rachel Andrew, talks about cross browser efforts to improve browser compatibility.
wandler
run ai in your browserinspired by the ▲ AI SDK & built on top of 🤗 transformers.js
Source: wandler
Wander is a project to run generative AI and machine learning models in the browser, something we are very interested in at Conffab.
Why AI Needs Information Architecture
One of the most common questions I’m asked is, “is information architecture still relevant now that we have AI?”
Of course, not everyone puts it like that. Instead, they’ll say things like “we won’t need navigation if we have chat” or “AI will organize the website” or “in a world with smart agents, we won’t need UI” or something like that. The gist is the same: Do we need structured information in a world with AI?
My unequivocal answer is yes
Source: Jorge’s Wager: Why AI Needs Information Architecture | Jorge Arango
One of Generative AI’s strengths is helping humans sift through and navigate information–summarisation and semantic search are two things it does very very well. So what place does Information Architecture have in this world? Jorge Arango argues AI needs Information Architects–read more about why.
Dear Student: Yes, AI is here, you’re screwed unless you take action…
It’s just facts, I’m a straight shooter. I’d rather tell it to you straight and provide actionable advice then placate feelings.
The steps that you take now will determine your success rate with obtaining a SWE role going forward. If you are a high autonomy person then you’re not fucked, as long as you take action.
Source: Dear Student: Yes, AI is here, you’re screwed unless you take action…
Geoff Huntley has been a software engineer a long time. He’s seen booms and busts in the market for Software Engineers come and go. He’s been writing extensively about the impact of LLMs on the profession of software engineering recently, and his latest is a strong wake call.
What is TypeScript? An overview for JavaScript programmers
Read this blog post if you are a JavaScript programmer and want to get a rough idea of what using TypeScript is like (think first step before learning more details):
- How TypeScript code is different from JavaScript code.
- How to run TypeScript code.
- How to edit TypeScript code in an IDE.
- Etc.
Note: This blog post does not explain why TypeScript is useful. If you want to know more about that, you can read my TypeScript sales pitch.
Source: What is TypeScript? An overview for JavaScript programmers
The always valuable Axel Rauschmayer has a detailed introduction to TypeScript for JavaScript developers. Follows on from his sales pitch for Typescript we linked to earlier in the post.
Web-AI Client-Side AI for Developers: Jason Mayes-Google’s Web AI Lead
In this episode of ‘Ventures with David,’ host David converses with Jason Mayes, Google’s web AI lead, about the innovations and implications of web AI and product management. They discuss how web AI shifts model deployment from server to client-side, enhancing user testing and reducing costs, latency, and carbon footprint. Jason shares his career journey at Google, focusing on exploring emerging technologies like TensorFlow.js.
They delve into practical applications of web AI, such as 2 billion parameter models running in browsers, enabling cost-effective, real-time functions. Jason emphasizes the significance of JavaScript in production outside academia and urges junior developers to create practical, problem-solving applications. The conversation aims to inspire learning in rapid AI tool deployment and the fundamentals of technical product management.
Source: Youtube
Web AI, the ability to run language models and machine learning in the browser is something we’re excited about at Conffab. Here, Jason Mayes who coined the term Web AI discusses the technology’s applications.
AI is Stifling Tech Adoption
I propose that the advent and integration of AI models into the workflows of developers has stifled the adoption of new and potentially superior technologies due to training data cutoffs and system prompt influence.
I have noticed a bias towards specific technologies in multiple popular models and have noted anecdotally in conversation and online discussion people choosing technology based on how well AI tooling can assist with its usage or implementation.
While it has long been the case that developers have considered documentation and support availability when choosing software, AI’s influence dramatically amplifies this factor in decision-making, often in ways that aren’t immediately apparent and with undisclosed influence.
Source: AI is Stifling Tech Adoption
I’ve definitely found LLMs will default to common, even if outmoded practices–such as using floats for page layout with CSS. But when prompted to use the particular techniques and technologies you want them to, that is usually enough to get what you want.
Great reading, every weekend.
We round up the best writing about the web and send it your way each Friday.
