The benefits of using a “content security policy” are many. Most importantly, it will stop your users from suffering any unsolicited scripts or content or XSS vulnerabilities on your website. In this article, Nicolas Hoffmann will introduce you to this technology, and he’ll explain why awareness is the most important advantage of CSP for website maintainers.
Read more…
Traditionally, scaling was mostly relevant for server-side systems. As more and more users would use your application, you needed to make sure that you could add more servers to your cluster, that your database could be split across multiple servers, and so on. Due to rich web applications, scaling has become an important topic on the frontend. The frontend of a complex app needs to be able to handle a large number of users, developers and parts. In this article, Max Stoiber shares everything you need to now about React Boilerplate to get started.
Read more…
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…