Let’s be honest: It’s not the design files that become bigger by magic. It’s designers who fill their files with unused, unoptimized and hidden elements that take unnecessary space. There are huge Sketch files that exist, and not only do they slow down Sketch, but also any designer’s productivity. In this article, Ahmed Sulaiman introduces a menu bar application that is bound to help you get rid of this headache.
Read more…
Intersection information is needed for many reasons, such as lazy loading of images. But there’s so much more. It’s time to get a better understanding and different perspectives on the Intersection Observer API. In this article, Denys Mishunov is going to go out of the scroll darkness and talk about the modern way of lazy-loading resources. Not just lazy-loading images, but loading any asset for that matter. And the technique he is going to talk about today is capable of much more than just lazy-loading assets. Ready?
Read more…
We asked our readers and the community to use everything they could to make their websites and projects perform blazingly fast. Today, Cosima Mielke is thrilled to show off the results of this challenge and announce the winner who will be awarded with some smashing prizes indeed! Thanks to everyone who participated in the challenge! We were quite happy with the quality of the submissions we received, and it honestly wasn’t easy to choose a winner. Keep up the brilliant work!
Read more…
With the coming of the Client Hints, Variants and Key specifications, there’s a lot to take in, and while it can be interesting to understand how the browser works under the hood, Andrew Betts shows you some simple things you can distil from it: Browsers ignore Vary for resources pushed using HTTP/2 server push, so don’t vary on anything you push. Vary is not as useful as it could be, and Key paired with Client Hints is starting to change that. Follow along with browser support to find out when you can start using them. And much more! Go forth and be variable.
Read more…
All webmasters should strive for improving the performance of their website, and increasing their website’s security. If you’re looking for ways to increase your website’s performance and security, Jonas Krummenacher brings you five methods that are great options. Not only are they all relatively easy to implement, but they’ll also modernize your overall stack. Some of these technologies are still in the process of being globally adopted; however, as demand increases, so will compatibility. Thankfully, there are ways to implement some of the technologies for browsers that support them, while falling back to older methods for browsers that do not.
Read more…
Not too long ago, front-end performance was a mere afterthought. Something that was postponed to the end of a project and that didn’t go much beyond minification, asset optimization, and maybe a few adjustments on the server’s config file. But things have changed.
Read more…
The first and most important thing you can do to improve the performance of your website’s images is figure out how to measure them. In this article, Eric Portis will show you Website Speed Test, a free and drop-dead-simple tool that leverages Cloudinary’s image smarts to let you measure, diagnose and communicate about the image performance of any website. Better yet, it’s built on top of, and integrated in, Pat Meenan’s WebPagetest. Interested? Read on!
Read more…
WordPress is a very robust, easy to use and feature rich content management system (CMS). Everyone from stay at home bloggers to fortune 500 companies rely on it every day. Just like with most platforms, if it isn’t properly used or optimized it can turn into a big headache very quickly. In this article, Brian Jackson has compiled a list of bad web practices and recommendations on what not to do on your site, based on thousands of hours of customer interactions, support tickets, and troubleshooting he experiences on a daily basis. Picking the right web host is very important. But your decision also goes hand-in-hand with educating yourself on how to best optimize your WordPress site.
Read more…
Fuse is not only used to describe the UI and layout; you can also use it to add effects and animation. In this article, Wern Ancheta will show you what Fuse is all about. He’ll show you how it works and how it compares to other platforms such as React Native and NativeScript. In the second half of the article, you will create your first Fuse app. Specifically, you will create a weather app that shows the weather based on the user’s current location. Towards the end of the article, you will consolidate your learning by looking at the advantages and disadvantages of using Fuse for your next mobile app project.
Read more…
Moving from one image for all kinds of devices to the common one-size-per-form-factor approach is definitely a step in the right direction. The downside is that, from a performance perspective, the approach is too general. There is more juice to be squeezed. However, from a development and maintenance perspective, it might make sense because three image sizes, or breakpoints, are manageable. In this article, Jon Arne Sæterås will look closely at how well the one-size-per-form-factor approach really works and how you can use smart content delivery networks to improve image performance.
Read more…