Search
KV Storage
1.4.2019
localStorage is...
Good! It's an incredibly easy API to use.
localStorage.setItem('name', 'Chris'); let name = localStorage.getItem('name');
Bad! Philip Walton explains why:
localStorage is a synchronous API that blocks the main thread, and any time you access it you potentially prevent your...
You probably don’t need input type=“number”
29.3.2019
Brad Frost wrote about a recent experience with a website that used <input type="number">:
Last week I got a call from my bank regarding a wire transfer I had just scheduled. The customer support guy had me repeat everything back to him because there seemed to be a problem with...
Better Than Native
27.3.2019
Andy Bell wrote up his thoughts about the whole web versus native app debate which I think is super interesting. It was hard to make it through the post because I was nodding so aggressively as I read:
The whole idea of competing with native apps seems pretty daft to me, too. The web gives us...
Technical Debt is Like Tetris
21.3.2019
Here’s a wonderful post by Eric Higgins all about refactoring and technical debt. He compares giant refactoring projects to being similar to Tetris:
Similar to running a business, Tetris gets harder the longer you play. Pieces move faster and it becomes harder to keep up.
Similar to running...
Some Notes About Accessibility
20.3.2019
Earlier this month Eric Bailey wrote about the current state of accessibility on the web and why it felt like fighting an uphill battle:
As someone with a good deal of interest in the digital accessibility space, I follow WebAIM’s work closely. Their survey results are priceless insights into...
Chrome Lite Pages
19.3.2019
The Chrome team announced a new feature called Lite Pages that can be activated by flipping on the Data Saver option on an Android device:
Chrome on Android’s Data Saver feature helps by automatically optimizing web pages to make them load faster. When users are facing network or data constraints...
The Benefits of Structuring CSS Around Appearance and Layout
13.3.2019
I like this point that Jonathan Snook made on Twitter and I’ve been thinking about it non-stop because it describes something that’s really hard about writing CSS:
I feel like that tweet sounds either very shallow or very deep depending on how you look at it but in reality, I don't think...
Application Holotypes
13.3.2019
It's entirely too common to make broad-sweeping statements about all websites. Jason Miller:
We often make generalizations about applications we see in the wild, both anecdotal and statistical: "Single-Page Applications are slower than multipage" or "apps with low TTI loaded fast". However,...
Accessibility is not a “React Problem”
11.3.2019
Leslie Cohn-Wein's main point:
While [lots of divs, inline styles, focus management problems] are valid concerns, it should be noted that nothing in React prevents us from building accessible web apps.
True. I'm quite capable (and sadly, guilty) of building inaccessible interfaces with React...
Extending Google Analytics on CSS-Tricks with Custom Dimensions
11.3.2019
The idea for this article sparked when Chris wrote this in Thank You (2018 Edition):
I almost wish our URLs had years in them because I still don't have a way to scope analytic data to only show me data from content published this year. I can see the most popular stuff from the year, but that's...
Get Started with Node: An Introduction to APIs, HTTP and ES6+ JavaScript
11.3.2019
Jamie Corkhill has written this wonderful post about Node and I think it’s perhaps one of the best technical articles I’ve ever read. Not only is it jam-packed with information for folks like me who aren't writing JavaScript everyday, it is also incredibly deliberate as Jamie slowly walks through...
Native Video on the Web
6.3.2019
TIL about the HLS video format:
HLS stands for HTTP Live Streaming. It’s an adaptive bitrate streaming protocol developed by Apple. One of those sentences to casually drop at any party. Äh. Back on track: HLS allows you to specify a playlist with multiple video sources in different resolutions....
CSS Algorithms
6.3.2019
I wouldn't say the term "CSS algorithm" has widespread usage yet, but I think Lara Schenck might be onto something. She defines it as:
a well-defined declaration or set of declarations that produces a specific styling output
So a CSS algorithm isn't really a component where there is some parent...
Refactoring Tunnels
6.3.2019
We’ve been writing a lot about refactoring CSS lately, from how to take a slow and methodical approach to getting some quick wins. As a result, I’ve been reading a ton about this topic and somehow stumbled upon this post by Harry Roberts about refactoring and how to mitigate the potential risks...
The Bottleneck of the Web
5.3.2019
Steve Souders, "JavaScript Dominates Browser CPU":
Ten years ago the network was the main bottleneck. Today, the main bottleneck is JavaScript. The amount of JavaScript on pages is growing rapidly (nearly 5x in the last 7 years). In order to keep pages rendering and feeling fast, we need to focus...
The Ultimate Guide to JavaScript Algorithms: Falsy Bouncer
4.3.2019
Falsy bouncer? Just in case your mind's been pacing frantically trying to make sense of the title of this challenge, worry not! We’ll do that together.
A bouncer is a person em
Using CSS Grid the right way
22.2.2019
Violet Peña has shared her recommendations for using CSS Grid. They basically boil down to these high-level points:
Use names instead of numbers for setting up our grid columns.
fr should be our flexible unit of choice.
We don’t really need a grid system anymore.
Although this is all great advice...
<span>L</span><span>e</span><span>t</span><span>t</span><span>e</span><span>r</span><span>s</span>
20.2.2019
Did you see this Facebook crap?
"Why do I need a 4Ghz quadcore to run facebook?" This is why. A single word split up into 11 HTML DOM elements to avoid adblockers. pic.twitter.com/Zv4RfInrL0
— Mike Pan (@themikepan) February 6, 2019
I popped over to Facebook to verify that and what...
Diana Smith’s Top 5 CSS Properties She Uses to Produce CSS Art
20.2.2019
Have you seen Diana Smith's CSS drawings? Stunning. These far transcend the CSS drawings that sort of crudely replicate a flat SVG scene, like I might attempt. We were lucky enough for her to post some of her CSS drawing techniques here last year.
Well, Diana has also listed the top five...
The #StateOfCSS 2019 Survey
15.2.2019
You know about the State of JavaScript survey, where thousands upon thousands of developers were surveyed about all-things-JS, from frameworks to testing and many other things in between? Well, Sacha Greif has launched one focused entirely on CSS.
This is super timely given a lot of the content...