Loading web-apps faster
by loading framework only for authorized users
Story telling
The homepage is mostly about displaying static data / HTML and yet most (if not all) of the framework based modern websites exhaustively load all their packages, exposing all their “minified” code.
Let’s face it — an user who doesn’t want to get into the web application is still being charged some data transfer and page-load time unnecessarily.
There are few good examples where the web applications doesn’t even need a homepage and straight away they render the Auth screen. For example Facebook, Instagram, Twitter.
All that was needed was to display the SignIn / SignUp forms without any introduction of what the product / company is all about.
Stats
Page Load (with ~ 50-100 Mbps broadband)
Facebook: ~3 seconds, ~8MB
Twitter: ~2 seconds, ~ 2.6 MB
Instagram: ~3 seconds, ~ 2.6 MB
Our approach
We will render plain HTML along with little bit of JS and CSS. Since the page-size will be smaller, the data transfer will be quicker so the page loads faster.
As we don’t need Angular for the Auth process, we will be loading them at the later stage when we really need them to handle the dynamic data and to handle the Single Page Application stuffs.
This would save considerable amount of data-usage
Pros
- Faster page load
- Less data consumption (Saves the Planet)
- [That’s all I can think of with my limited knowledge]
Cons
- [I couldn’t think of anything at this moment with my limited knowledge]
Do let me know if my article needs correction / improvement. TIA.
