The Weather Network

Re-architecting Canada’s 2nd highest traffic mobile website, The Weather Network



Google Cloud


Microsoft Azure


Frontend Development

Backend Development

Architecture Design

About The Weather Network

The Weather Network (TWN) website is one of the most popular websites for weather information for Canadians and people around the world. It receives over 47.5 million visitors per month, making it one of the most visited weather websites in the world. With TWN being such a critical pillar of Canadian’s daily lives, continuously improving the experience is always a core priority.

As consumers increasingly continue to view content via mobile devices versus desktop devices, The Weather Network wanted to ensure their architecture and infrastructure was keeping up with new technology standards and was allowing their engineering team to develop swiftly without accumulating technical debt. That’s when Lazer was approached to help. With a focus on mobile-first, our goal was to review the current architecture, identify areas of improvement, refactor the architecture to an improved state, and begin implementing it with the engineer team.

As a result of Lazer's work, The Weather Network was able to improve the performance and scalability of their website, and make it easier for their engineering team to develop new features.

Our Approach


Identifying the goals The Weather Network wanted to achieve

In order to make the new architecture a success, we sought to understand what success looked like for The Weather Network. The team wanted the following:

• Faster page load speeds to improve UX and SEO.

• Server-side rendering of content, when applicable, to ensure Google can index content well.

• Client-side rendering of content that didn’t need to be indexed by Google, such as advertisements.

• Efficient, simple caching of content, data responses, templates, etc.

• Ability to handle large spikes in traffic at any given moment while maintaining peak performance.

• Effective SSL termination and load balancing.

• A modern app layer that is flexible and can integrate well with an independent set of microservices which are developed separately.

• The ability to measure core analytics and run A/B experiments on client side features and SEO.

Image of TWN's dashboard showing Admin views

Understanding the current architecture state and their current blockers for progress

Diving deep into their current architecture and pain points, we identified that they were running with a legacy PHP-based stack that was making it difficult to iterate, managing a number of microservices with different frameworks, maintaining multiple layers of unnecessary caching, and using too many testing tools which they were not leveraging the full capabilities of.

Image of TWN's dashboard showing UI

Crafting a scalable web application stack and structure

With a modern, architecture in mind, we architected a web application stack and structure that included:

• Next.js and Express for the server and main app framework.

• React as the frontend framework, with Next.js for pre-rendering/static page generation to ensure server-side rendering for SEO purposes.

• Given the use of microservices, a database wouldn't be needed directly for the web application, but if so, our recommendation was to utilize Mongo


Solving multiple layers of unnecessary caching

To simplify the multiple layers of unnecessary caching, we recommended to remove Varnish and simply stick to NGINX for SSL termination and to streamline caching after the delivery network.

Image of TWN's dashboard showing embeddable views
Image of Syctera's onboarding flow

Emphasizing scalability, performance, and monitoring through a cloud-based approach through Google Cloud, AWS, or Microsoft Azure

After discovering that most of the architecture was primarily run on-premises, our primary recommendation was to start transitioning to cloud-based infrastructure to gain resource flexibility. To maintain peak performance and to monitor systems effectively, Grafana, Istio, and NGINX should be utilized to monitor requests, response times, connection counts, response and server statuses, and for traffic in general.


Simplifying testing efforts and focusing on using them well

To simplify their testing efforts, we recommended reducing the number of testing tools by focusing on Jest and Puppeteer for unit and end-to-end testing, and by focusing on K6 for performance/load testing. For cross-browser and device testing, we found BrowserStack as the best fit.


Measuring and monitoring experiments and analytics

For The Weather Network, analytics and experimenting is a huge component to the success and improvement of the website. We found the current method that was used to address analytics was already well done and shouldn't be changed. With respect to client-side experimentation, implementing client-side A/B testing when making product decisions would allow their teams to be much more data-driven in their approaches. With respect to SEO experimentation, implementing SEO A/B testing here as it would allow them to see large improvements in the success of their presence on search engines.


Coaching the TWN engineering team on the new architecture

Upon finalizing the new architecture, we crafted a plan and timeline to train the TWN engineering team on the new architecture, create a few POCs to slowly migrate the application from the old architecture to the new one, and pair-programmed with them to ensure knowledge was transferred over effectively.

Image of Syctera's onboarding flow

The Result

As a result of Lazer’s collaboration with The Weather Network, significant improvements were achieved in the performance and scalability of the mobile website. With the new architecture, we were able to solve for The Weather Network’s core pain points and blockers and work towards a path that would offer their user base and tremendous improvement with regards to the speed and experience of the website. We’re extremely fortunate to have had the opportunity to work with such a great team.