Each year I bring together the highlights of the past twelve months in the frontend space, whether it be a neat CSS tip, some landmark browser news, or a deep-dive tutorial. This year is no different of course, so consider this the highlight reel of what made an impact in the frontend world in 2019.

As a quick aside, the data used to compile this list comes via Frontend Focus, an email newsletter with over 90,000 developers reading it. This list represents some of the most clicked articles of the year.

The Frontend highlights of 2019:

Front-end Developer Handbook 2019

This detailed guide from Cody Lindley always proves popular, and this year is seemingly no different. This resource was updated in April and is packed with useful resources, learning materials and dev tools. It remains a worthwhile reference.

---

The State of CSS 2019

The results from the first ever 'State of CSS' survey dropped in June. It asked over 10,000 developers what CSS features and tools they favoured. It's still worth digging into all the data, as you'll gain a broad awareness of what people are using in practice as CSS evolves.

---

Inside Microsoft’s surprise decision to work with Google on its Edge browser

One of the biggest surprises in the browser landscape this year was Microsoft's decision to switch over to using Chromium as the engine behind their Edge browser. This inside story behind the how and why of such a "monumental decision" got plenty of attention. The first 'full release' of this new browser is expected in early 2020.

---

W3C approved WebAuthn as the web standard for password-free logins

Back in March the W3C shared news that the Web Authentication API (WebAuthn) had become an official web standard for password-free logins on the web. Since then support for the security-focused standard has been growing, with browsers such as Safari and Firefox, and big names like Twitter and eBay adding support.

---

10 HTML Elements You Didn't Know You Needed

Emma Wedekind took a quick look at a handful of HTML elements you might not have known existed. These include the <output>, <meter>, and <progress> tags to name just a few.

---

The Great Divide in Front-End Development Skills

Published back in January, this interesting think piece shares what Chris Coyier (of CSS-Tricks fame) perceives as a widening gulf between different types of frontend developer. It asks if there is such a thing as a frontend developer or whether we're all moving towards becoming either UX engineers or JavaScript developers?

---

Front-End Performance Checklist 2019

Here's another from January. This frontend performance checklist has been publishing for several years, starting out in 2016, and was updated once again with fresh, up-to-date advice for 2019 (I'd imagine we'll probably see a 2020 update in a few weeks). It highlights the issues you might need to consider to ensure that your response times are fast, user interaction is smooth and your sites don’t drain user’s bandwidth. It's also available in a 'tickable' PDF format.

---

My favorite CSS hack

* { border: 1px solid red } is a classic 'trick' for debugging CSS and HTML issues by putting borders around every element. This well-received tip from Gajus Kuizinas took things a few extra steps, however, and helps you get a better overview, particularly with nested elements.

---

To Grid or to Flex?

In a year where flexbox usage hit a critical mass and grid adoption grew at a sizeable clip, Michelle Barker unpacked when and where you might want to use either of these layout methods, and some reasons for choosing one or the other.

---

Things We Can’t (Yet) Do In CSS

Rachel Andrew shared this look at common layout patterns that aren't achievable just yet in currently widely supported CSS standards, plus reviews the forthcoming CSS specifications that might enable them in near future.

---

The Simplest Way to Load CSS Asynchronously

This simple tip explains how you can asynchronously load your CSS file with a short line of concise HTML as a way to improve page performance.

---

HTML5's Input Types: Where Are They Now?

HTML5 introduced thirteen new types of form input, adding significantly to the number of different fields we could add to our forms. This article from earlier in the year checked in, asking what the state of those field types was in 2019.

---

---