Performance is now one of the core value for modern web app. Most of the user shift the web browser experiences from desktop to mobile web. Other than smaller screen, lower CPU power, network condition becomes one of the important factor to make your content assessable to all users.
We want all of our user can enjoy the same experiences globally regardless of the network conditions (and respect user’s preferences in terms of data consumption).
We use some aggressive prefetch/preload strategies in order to make seamless experiences on interactions. …
Service worker finally lands on all the modern browsers 🔥. It’s definitely a good time for you start playing around if you haven’t yet done so.
In short, service worker serves as a proxy that enables web application to provide a fast, reliable, and engaging experience. It also progressively enhance your exciting code base which make it even easier to adopt (and will not affect browsers that doesn’t support those features).
Tinder — One of the most popular online dating service, is now available on the web platform worldwide.
We start this journey not so long ago when the company already invested heavily on native app experience and advance machine learning technology.
We realize that not all users has the latest mobile device with big storage and ultra high speed network speed to run our native client. Web platform then serve a very good purpose — able to run mostly anywhere with a relative lite required resources.
Our web team has a relative small size, but we starts with a great…
I still remember the time when parallax scrolling becomes a hit in mordern webpage development, everyone suddently feels that the smooth scrolling is a requirement for a website.
The drawback is there is no transition so the page kind of jump around when navigate.
You could use…
It’s very enjoyable to develop front-end fancy features rapidly, but as your project grows and people starts to complain about bad performance, it might not be the most interesting task in the world to deal with. Lots of time if we start a project with performance in mind, life will be much easier.
This post will start from the very beginning (and one of the most basic topic) — how to load an image properly (good performance), followed by some detail profiling and working examples.
*Update: (April, 2019) ~Chrome 76 delivers native lazy load for
<iframe>, checkout Addy’s…
I found it interesting (and sometime challenging) when in comes to React performance optimization.
In general, there are several angles we could tackle. Some of the optimizations are probably for web app in general (Progressive web app).
This post will focus…