Improving every tiny thing by 1% dramatically improves performance. This applies to what Marko Dugonjić did in the SGS project and its intricate navigation. By focusing on the finer details, improving each detail by a tiny bit, he significantly reduced the complexity of the navigation and improved loading times, while keeping the navigation appealing and engaging for users. No web project is ever truly complete; there are always a few more things on the to-do list. That’s perfectly fine, as long as you keep on testing, refining and providing the best experience for users.
Read more…
This week’s reading list consists of a lot of little, smart details that you can use on websites. From tweaking the user’s reading experience during page load to pure JavaScript functions and verifying the integrity of external assets. And finally, we see some articles on thinking differently about established working habits — be it working on AI without data or the virtue of not shipping a feature.
Please note that I’ll be on vacation for the next four weeks, so please don’t expect any new Web Development Reading List before October, 7th. Enjoy September, your work, your life!
Read more…
Every time the browser has to recalculate the positions and geometries of elements in the document, a reflow happens. This happens when new DOM elements are added to the page, images load or dimensions of elements change. There are many solutions for avoiding the jump effect on page load, and implementing all of these techniques would take some time, but it is totally worth it — until scroll anchoring is supported in more browsers. In this article, Michael Scharnagl will share techniques to minimize this content shifting.
Read more…
What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
Extensible and customizable tools are nothing new. Most of what we use can be extended in one way or another, whether in the form of add-ons, plugins or specialist languages. Christian Heilmann wrote a lot of extensions and toolbars, which very much boosted the productivity of his company back then. Thankfully, these days, companies understand that offering specialist languages is time wasted, when the web stack has grown to become much more interesting to build applications with. If you download Visual Studio Code now, you will see that my autocomplete feature is a part of it. And here is how Christian did that.
Read more…
What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
One of the upcoming features of JavaScript that I especially like is the support for asynchronous functions. In this article, I would like to show you a very practical example of building a server-side application using Koa 2, a new version of the web framework, which relies heavily on this feature.
First, I’ll recap what async functions are and how they work. Then, I’ll highlight the differences between Koa 1 and Koa 2. After that, I will describe my demo app for Koa 2, covering all aspects of development, including testing (using Mocha, Chai and Supertest) and deployment (using PM2).
Read more…
Currently, GitHub Pages doesn’t offer a route-handling solution; the Pages system is intended to be a flat, simple mechanism for serving basic project content. GitHub does provide one morsel of customization for your project website: the ability to add a 404.html file and have it served as your custom error page. Turns out that many folks have experienced the same issue with GitHub Pages and liked the general idea. However, the problem that some folks on Twitter correctly raised was that the 404.html page is still served with a status code of 404. The gauntlet had been thrown down, and in this article, Daniel Bauchner decided to answer — and answer with vigor!
Read more…
What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
In the previous article, Clayton Anderson showed you how React Native can help you make iOS and Android apps with a shared code base, without sacrifices in quality. But what about the web? React Native for Web is intended to let you write a single app that runs in a browser using standard web technologies, or on iOS and Android as a real native mobile app. While I don’t think the project is ready for production use yet, its potential success could mark a massive change in how large multi-platform applications are built. Let’s jump in!
Read more…
