Scaling to 100K MAU by focusing on performance optimizations

My first week at Biztree

Upon joining Business-in-a-Box as a developer, I approached my role with enthusiasm despite the significant challenges ahead. While my React proficiency provided a strong foundation, adapting to the company's Vue.js and Nuxt framework required expanding my technical repertoire. I was tasked with optimizing two underperforming websites that averaged Lighthouse scores in the 50s, requiring strategic performance improvements without established optimization guidelines.

The challenge

We managed two distinct platforms: the main site, business-in-a-box.com, was an SSR marketing site which was easier to optimize with caching, predictable content, and packages developed for performance gains. But /templates was a different challenge: over 10,000 static pages pulling content from an API, bogged down by bloated JavaScript and sluggish load times. While both needed to convert users, it was the templates site that pushed me to dig deep into performance tuning, smarter loading strategies, and Nuxt’s build process.

My approach

I didn’t have a map just a long list of performance issues and a tech stack I had never touched before. Vue and Nuxt were completely new to me, but I approached the project like a puzzle: break it down, learn fast, and solve one piece at a time. I dove deep into performance metrics, Nuxt’s build process, and the way JavaScript behaves in the browser peeling back layers until I could see where things were slowing down and why.

• 1
  Vue and Nuxt

  My journey into performance optimization began with understanding Vue and Nuxt through Maximilian Schwarzmüller's course. The curriculum covered Vue 2 fundamentals, directive syntax, component architecture, reactivity, and state management. What made the learning experience enjoyable was building interactive games throughout the course.

• 2
  Core Web Vitals and Lighthouse

  Next, I focused on performance optimization through Core Web Vitals and Lighthouse analysis. I studied key metrics including Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS) to understand user experience impact. Web.dev proved invaluable, offering extensive articles, reading materials, and instructional videos that demonstrated practical techniques for improving these metrics. Using Lighthouse reports helped identify performance bottlenecks, accessibility issues, and SEO opportunities.

• 3
  Webpack

  To further enhance performance, optimizing Webpack became the next goal. Using the --analyze flag revealed bundle composition and identified optimization opportunities. I implemented strategic improvements including a maximum chunk size of 244,000 bytes, minification, and content hashing. Customizing the Webpack configuration enabled refined asset processing and tree shaking to eliminate unused code.

• 4
  First Principles & Code-Splitting Strategy

  I adopted a first principles approach to performance by understanding the fundamental mechanics of how websites load and execute. This led me to discover the primary bottleneck: the 'custom-description' modules. Originally, every single custom description was being loaded on every template whether or not it was needed. So, I built a middleware that loads and renders custom markdown only when specifically required by a page. This implementation involved some trial and error, partly due to Nuxt’s quirky asset handling, especially when dealing with nested directories.

The results

The impact was tangible. I helped transform the site into a high-performance, multilingual platform, scaling from 20K to over 100K monthly active users. Lighthouse scores jumped from the mid 50s to the 90s, a 40% boost in load speed that users (and Google) noticed. Our average search ranking climbed from 10+ to position 5, driving more organic traffic and ultimately increasing conversion rates. We also achieved WCAG AA accessibility compliance, making the experience more inclusive.

As a bonus win, I reduced site generation time by 75%, through a “side quest”, implementing smarter dynamic route generation for multi-language support and tweaking build concurrency to dramatically speed up testing and build time.

Revenue impact

The chart highlights revenue changes based on user volume and conversion rates. With a $215 annual subscription, 0.5% of 100,000 users converts to 500 subscribers, generating $107,500 per month or $1,290,000 per year. At a 1% rate, that’s 1,000 subscribers and $215,000 monthly or $2,580,000 per year.

My learnings

Working on Biztree's performance optimization journey taught me how to break down complex challenges into actionable steps, even with an unfamiliar tech stack. I went from knowing little about Vue and Nuxt to leveraging their inner workings to drive real business results. Along the way, I gained a deep understanding of Core Web Vitals, asset optimization through Webpack, and how to apply first principles thinking to front-end performance. Most importantly, I saw firsthand how performance directly impacts revenue. Faster load times improved user experience, boosted our Lighthouse scores, and significantly increased organic traffic. That traffic converted into paying customers. Performance isn’t just a developer metric, it’s a growth lever.

In hindsight, the static site generation process could have been pushed even further. Techniques like memoization, smarter caching strategies, and parallelized content prefetching could have shaved off even more build time. These insights have made me a more resourceful developer, more comfortable with navigating ambiguity, and more confident in delivering performance at scale.