I’ve been more or less mute for the last four weeks because I somehow managed to get an injury inside my throat. Not being able to talk means going out and meeting people is not much fun (wonder what that says about me), so I’ve been spending a lot of time tinkering at home.

… and some days I just do this

I’ve been curious for a while about how much impact merely including a JavaScript framework has on the performance of a web page. I started thinking about this a few months ago, when I spent a rather frustrating afternoon trying to improve the parse and evaluation…

In June 2018, Quintype approached Uncommon to help them improve the performance of their reader-facing web frontend as well as their customer engagement platform.

Working together, Uncommon and Quintype achieved the following goals within a span of two weeks:

  • Improved the Google Lighthouse score of Quintype’s reader-facing web frontend by ~20 points
  • Reduced the size of one of the JavaScript bundles on their customer engagement platform by over 90%
  • Discovered the cause for an input latency of ~500 milliseconds in one of their products and outlined the fixes required to eliminate it
  • Trained two of their developers in the art…

मैंने बचपन में पढ़ने-लिखने की शुरूआत हिन्दी-भाषीय कामिक्स के साथ की थी. पहले चाचा चौधरी की चुटकीली कहानियां, और फिर राज कामिक्स के सुपरहीरोज़ के बहादुरी भरे कारनामे — साहित्य की दुनिया से मेरा लगाव यहीं से शुरू हुआ.

डोगा मेरा मनपसंद एंटी-हीरो हुआ करता था

इस देश के बड़े शहरों के स्कूलों में भारतीय भाषाओं से ज़्यादा अंग्रेज़ी पर ज़ोर दिया जाता है. मेरा स्कूल कुछ अलग नहीं था. जब तक हम ग्यारहवीं या बारहवीं कक्षा में पहुंचे, मैं और मेरे सभी मित्र हिन्दी के मुकाबले अंग्रेज़ी लिखने-पढ़ने से ज़्यादा वाकिफ़ हो चुके थे. इसमें हमारी गलती भी नहीं थी. अंग्रेज़ी हम पर हर दिशा से…

Part 1 of this case study was a general overview of how the Alaris Prime team rebuilt abof.com to load almost instantly even on flaky mobile connections, and part 2 was an account of how we got to grips with the often confusing React ecosystem. If you haven’t checked out the first two parts yet, you should do so now.

In this final part of our case study, I’ll discuss a few specific issues we ran up against through the course of the project, and how we tackled them.

Keeping Track of Scroll Position in an Infinite Scrolling Grid

abof’s product listing page is an infinitely scrolling grid of product…

If you haven’t read the first part of this case study, I suggest you go check it out before diving into the second part. It’s a quick read that explains in detail our motivations for the technology choices we made while building the new abof.com.

Done? Great! In this second part, I’ll talk about my and my team’s impressions of the React ecosystem, our opinions on build tooling, and our approach to performance testing.

Learning React

When we started working with abof, all of us were primarily Angular 1.x developers. …

abof.com (pronounced ae-boff dot com) is an online fashion store that’s part of Aditya Birla Group’s e-commerce strategy. Earlier this year, the company brought in the Alaris Prime team along with Ciju from ActiveSphere Technologies for a complete rewrite of the product listing page on abof.com. After we delivered the rewrite, the load times for the page on 3G connections went from ~20 seconds to ~7 seconds, and bounce rates decreased by over 40%. These improvements have encouraged abof to invest a significant chunk of their technology resources into web performance, in particular the React and Redux ecosystem.

In this…

Ankur Sethi

Independent frontend developer · hip-hop nerd · https://ankursethi.in

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store