← Back to Projects

Falx

High-performance cyber security consultancy platform achieving 99+ Lighthouse scores with Sanity CMS, dual-theme brand surface, and integrated blog.

astrotailwindsanity
Falx project showcase

Key Achievements

Near-Perfect Core Web Vitals: Delivered a cyber security consultancy platform scoring 99 performance, 100 accessibility, 100 best-practices, and 100 SEO on Lighthouse — shipping near-zero JavaScript for instant load on content-heavy pages.

Self-Sufficient Publishing Workflow: Implemented a Sanity.io headless CMS so the Falx team can publish service pages, regulatory insights, and blog posts without developer dependency.

Security-Hardened Content Pipeline: Built content sanitization (dompurify) and spam-protected contact forms into a sector where trust and vigilance are the product itself.

Dual-Theme Brand Surface: Engineered a persistent light/dark theme system with FOUC prevention so the consultancy’s visual identity holds across every route and device.

Falx Lighthouse performance report
Lighthouse audit: 99 performance, 100 accessibility, 100 best-practices, 100 SEO

The Challenge

Falx, as a specialist cyber security consultancy, needed a marketing surface that matched the credibility and precision security buyers expect from the firms they trust. Several challenges shaped the brief:

  • Trust Through Performance: B2B security buyers judge a firm’s competence by how its own site loads — slow or unoptimized assets read as carelessness in a sector selling vigilance.
  • Content Velocity Without Developer Bottleneck: Service pages and regulatory commentary need rapid publishing, but a developer-gated CMS turns every update into a ticket.
  • Cross-Theme Brand Consistency: A fragmented light/dark identity across devices erodes the professional polish the brand promises.
  • SEO Discoverability in a Crowded Niche: Organic search placement directly drives lead generation in competitive cybersecurity keywords.

My Approach

I implemented an infrastructure-first build strategy focused on:

  1. Static-First Build Pipeline: Chose Astro’s static site generation over a React SPA so the marketing surface ships almost no JavaScript and holds a 99+ performance score.
  2. Tailwind Utility-First Brand System: Adopted Tailwind CSS v4 to enforce the purple/black/grey palette as design tokens rather than bespoke CSS scattered across components.
  3. Headless Content Layer: Integrated Sanity.io via @sanity/astro so content modelling and publishing live outside the codebase and survive redeployments.
  4. Persistent Dual-Theme System: Implemented light/dark theming with localStorage persistence and FOUC prevention, rather than a CSS-only toggle that loses state on reload.
  5. Isolated Interactive Islands: Scoped interactivity — carousels via Glide, search via Pagefind, consent via vanilla-cookieconsent — as individual islands instead of bundling a heavy client framework.
Falx services page in light and dark mode
Services route rendered in light and dark — theme system holds across both

My Solution

Technology Stack Implementation

Astro: Chosen for its islands architecture — the marketing site ships almost no JavaScript, with interactivity hydrated only where needed, keeping Core Web Vitals excellent on content-heavy pages.

Tailwind CSS v4: Chosen for utility-first development of a fully custom responsive layout that holds the consultancy’s purple, black, and grey brand system consistently across every breakpoint.

Sanity.io: Integrated via @sanity/astro and @sanity/client for flexible content modelling — the Falx team publishes services and blog posts without touching code.

SEO & Accessibility Suite: @astrojs/sitemap, astro-seo, astro-robots-txt, and astro-icon cover search optimization and accessible iconography across every route.

Interactive Islands: @glidejs/glide for carousels, astro-pagefind for client-side search, and vanilla-cookieconsent for GDPR compliance — each scoped, never bundled globally.

Key Features Delivered

  • Multi-Page Architecture: Home, Services, About, Blog, and Contact routes, with room to extend into Case Studies and Careers.
  • Mobile-First Responsive Layout: Seamless adaptation across viewports via Tailwind’s responsive prefixes.
  • Content Security: dompurify sanitizes CMS-rendered HTML, and contact forms carry robust spam protection.
  • Client-Side Search & Discovery: astro-pagefind powers dynamic in-site search without a server round-trip.
  • Dual-Theme Experience: Persistent dark/light switching with no flash on load.
Falx contact and our-approach pages
Contact and Our Approach routes — multi-page breadth of the build

Measurable Results

Core Web Vitals:

  • Lighthouse performance 99, accessibility 100, best-practices 100, SEO 100 — a near-perfect audit across the board.
  • Near-zero JavaScript shipped, with interactivity hydrated only where the page actually needs it.
  • Excellent Core Web Vitals posture sustained on content-heavy pages.

Operational Efficiency:

  • Marketing team publishes new service pages and regulatory commentary in minutes via Sanity — previously a developer ticket measured in days.
  • Content workflow decoupled from the codebase, enabling rapid response to industry developments.

SEO & Brand Surface:

  • Per-page meta, sitemap, and robots coverage via astro-seo and @astrojs/sitemap strengthen organic discoverability.
  • Consistent on-brand experience across light/dark themes with no flash on load.

Explore More Projects

View All Projects