Editor's Pick
QX82 - Tiny JavaScript game engine inspired by retro 80s computing
QX82 is a tiny Javascript engine that lets you create games and experiences inspired by the look and feel of a retro 80s computer. It's not an emulator or a fantasy console: it's just a Javascript library.
Accessibility
How we’re opening up access to GOV.UK Forms
Here at GDS, we’re making it easier for departments to build better digital services. GOV.UK Forms is an online form builder which can be used to make accessible and easy to use digital forms for GOV.UK. It saves time for departments that are processing form submissions, and time for users that are filling in forms.
GOV.UK Forms is currently in private beta, where we’re testing the product out with a small number of teams that own forms. This is to help us steadily understand how our product is working and what issues we need to address. After that, we’ll move into public beta, where we’ll open up GOV.UK Forms for any central government department to use freely.
Really hope they open this up to anyone non-government in the future, they do great work around accessibility.
What's New in WCAG 2.2
This page lists the new success criteria in WCAG 2.2, with:
- A brief introduction of what to do and why it’s important
- Quotes from personas to help you understand some aspects of the success criteria
- Links to Understanding documents that explain the success criteria in detail and provide more examples
CSS
Single Element, Pure CSS Pie Charts
This article explores a technique for creating a single element CSS pie chart that can display an arbitrary set of values, using a few basic style rules.
augmented-ui - Integrate your apps with technology
augmented-ui is just CSS.
- Futuristic, Sci-Fi shaping for any element
- Add mixin names to the "data-augmented-ui" attribute to equip augs with preset property configurations
- Customize the --aug-properties to make it feel just right
- Full support, global user reach of 92.96%!
The Future of CSS: Easy Light-Dark Mode Color Switching with light-dark()
To change a color based on whether Light Mode or Dark Mode used, you’d typically use a prefers-color-scheme Media Query. To make things easier, CSS now comes with a utility function named light-dark(). The function accepts two color values as its arguments. Based on which color scheme you are actively using, it will output the first or the second argument.
<css-doodle />
<css-doodle /> is based on Shadow DOM v1 and Custom Elements v1. You can use it on all major browsers right now without polyfills.
The component will generate a grid of divs by the rules (plain CSS) inside it. You can easily manipulate those cells using CSS to come up with a graphic pattern or an animated graph.
The limit is the limit of CSS itself.
OKLCH in CSS: why we moved from RGB and HSL
CSS Color Module 4 adds oklch(), and we gain P3 wide-gamut support, boost code readability, and improve developer-designer communication.
JavaScript
A comprehensive guide to the dangers of Regular Expressions in JavaScript
A deep investigation into regular expression denial of service (ReDoS) vulnerabilities in JavaScript
js-framework-benchmark: A comparison of the performance of a few popular javascript frameworks
This is a simple benchmark for several javascript frameworks. The benchmarks creates a large table with randomized entries and measures the time for various operations including rendering duration.
DataGridXL: Excel-like Experience for Web Apps
You've built a web app, but your users stick to Excel. Spreadsheet-like DataGridXL helps you win over these users.
Animating Multi-Page Navigations with Browser View Transitions and Astro
A beginner-friendly guide that walks you through the use of the Browser View Transitions API with Astro for a smoother navigation experience.
QX82 - Tiny JavaScript game engine inspired by retro 80s computing
QX82 is a tiny Javascript engine that lets you create games and experiences inspired by the look and feel of a retro 80s computer. It's not an emulator or a fantasy console: it's just a Javascript library.
Nostalgist.js
Nostalgist.js is a JavaScript library that allows you to run emulators of retro consoles within web browsers.
Miscellaneous
Beyond XSS - explore the web front-end security universe
If we compare the field of web front-end security to a universe, XSS might be the biggest and brightest planet that captures most people's attention. But besides XSS, there are many other smaller planets and stars in the universe that have always been there, you just haven't noticed them.
Apart from XSS, there are many other security topics worth learning, such as prototype pollution that exploits JavaScript features, CSS injection attacks that can be executed without JavaScript, or side-channel attacks like XSLeaks in web front-end development.