Lessons learned from building a thriving Vue.js SaaS application

How do you handle API version skew when users don't reload your app for over 70 days?

#1about 3 minutes

Building a complex Vue.js SaaS application at scale

An overview of the Rasayel application, a feature-rich platform built for WhatsApp business communication by a small engineering team.

#2about 2 minutes

Why Vue.js and GraphQL were chosen for scalability

The decision to use Vue.js for its easy onboarding and GraphQL for end-to-end type safety was crucial for shipping features quickly.

#3about 5 minutes

Organizing a large codebase with a monorepo and flat components

A monorepo with isolated deployment targets and a flat component structure simplifies refactoring but can lead to component duplication at scale.

#4about 4 minutes

Using composables and barrel files to manage logic

Logic is isolated in Vue composables and organized with barrel files, which must avoid side effects to ensure proper tree shaking.

#5about 2 minutes

Building UI-agnostic composables for data management

Composables are designed to handle data fetching, transformations, and real-time updates without any knowledge of the UI rendering them.

#6about 8 minutes

Navigating state management patterns and their trade-offs

An analysis of different state management approaches, from simple refs to provide/inject, highlights challenges with ownership and developer experience.

#7about 3 minutes

Focusing on the right metrics for SPA performance

For a complex single-page application, focusing on Cumulative Layout Shift (CLS) and Interaction to Next Paint (INP) provides more value than raw Lighthouse scores.

#8about 2 minutes