How Removing Caching Improved Mobile Performance by 25%
Article Summary
Klarna's team removed their caching layer and saw a 25% performance boost. Wait, what?
Case Taintor from Klarna Engineering set out to defer loading a fullscreen iframe to improve their checkout experience. Instead, his benchmarking revealed a hidden performance killer that had been lurking in production for years.
Key Takeaways
- Application cache was downloading duplicate assets while pages loaded normally
- Chrome's Network tab hides offline cache traffic entirely
- PhantomJS benchmarking with Docker revealed the hidden downloads
- Removing app cache cut Chrome Mobile load times by 25%
- HTTP caching headers already provided the performance they needed
An optimization attempt uncovered that their application cache manifest was secretly downloading unnecessary assets, and removing it improved mobile performance by 25%.
About This Article
Case Taintor's team wanted to defer fullscreen iframe loading to improve performance. When they tested it, the results didn't match across machines. His own computer showed barely any improvement, but his colleagues were seeing gains over 50%. Something was clearly wrong, but they couldn't figure out what.
Taintor used PhantomJS with Docker and chrome://net-internals to dig deeper. He found that the application cache manifest was downloading duplicate assets while the page loaded. These duplicate downloads were competing with normal resource requests, which hid the real performance problem.
Once they removed the unnecessary application cache manifest, load times on Chrome Mobile dropped by 25%. The fullscreen deferral then added another 15% improvement on Taintor's machine.