Case Study

Angel One AMP

Automated AMP Framework for Financial Content

Role: Full-Stack DeveloperDuration: 2018 – 2024Industry: FinTechPlatform: AMP + WordPress
AMPWordPressPHPJavaScriptHTML5Google Search ConsoleSchema.orgMySQLREST APIsGit
AMP
<2sMobile load time

Project Overview

Angel One required AMP (Accelerated Mobile Pages) versions of its content to improve mobile search rankings and user experience on slow connections. Over a six-year engagement, I built an automated AMP generation framework that converted WordPress content into valid AMP pages at scale.

The system handled diverse content types — financial articles, educational videos, branch listings with maps — each rendered as a valid AMP page with appropriate components and structured data. The framework was fully automated through WordPress hooks, regenerating AMP versions on every content update without manual intervention.

Engineering Challenges & Solutions

01

Content Diversity

Building a single AMP framework that could handle diverse content types — financial articles, educational videos with transcripts, and branch listing pages with maps — each requiring different AMP components.

Solution: Modular AMP Framework

Built a modular AMP component system that mapped WordPress post types to specific AMP layouts — article, video with schema, branch with LocalBusiness markup — each using the appropriate AMP components (amp-video, amp-img, amp-iframe).

02

Template Mapping

Creating a reliable template mapping system that matched each WordPress post type and template to its correct AMP layout, with fallback handling for edge cases.

Solution: Template Registry

Created a template registry in the WordPress theme that mapped page templates and post types to AMP layout files, with a fallback generic template for unmapped content types.

03

Content Synchronization

Ensuring AMP pages stayed synchronized with canonical WordPress content — when an article was updated, the AMP version needed regeneration without manual intervention.

Solution: WordPress Hook Integration

Integrated the AMP generation pipeline with WordPress transition_post_status hooks — every content save or update automatically triggered AMP regeneration with cache invalidation.

04

AMP Validation

Maintaining strict AMP validation across thousands of pages while content teams regularly updated articles, added media, and modified layouts.

Solution: Automated Validation Pipeline

Built automated AMP validation into the deployment pipeline, running amphtml-validator against generated pages and blocking deployment if validation failed.

05

SEO Integration

Properly implementing rel=amphtml and canonical link tags so search engines correctly indexed AMP pages without splitting ranking signals between canonical and AMP versions.

Solution: Dual Linking Strategy

Implemented proper rel=amphtml on canonical pages and rel=canonical on AMP pages, ensuring Google consolidated ranking signals correctly between the paired pages.

Performance Engineering

AMP HTML Compliance

Strict adherence to the AMP HTML specification — no custom JavaScript, restricted CSS to 75KB, all external resources loaded via AMP components.

Async Loading

All resources loaded asynchronously by default in AMP — images via amp-img, videos via amp-video, analytics via amp-analytics.

Resource Prioritization

AMP framework prioritizes above-the-fold content, deferring non-critical resources and preloading key assets.

Mobile Optimization

Sub-2-second load times on mobile 3G connections achieved through AMP restrictions on render-blocking resources.

CDN Caching

AMP pages were served through Google AMP Cache and Cloudflare, providing instant load times for returning visitors.

Engineering Contributions

Designed and built an automated AMP generation framework that converted WordPress content into valid AMP pages across multiple content types.

Created a template mapping system that matched each post type (articles, videos, branches) to the correct AMP layout with schema markup.

Integrated the AMP pipeline with WordPress hooks for automatic regeneration on content updates, ensuring AMP pages stayed synchronized.

Implemented proper SEO linking strategy with rel=amphtml and canonical tags, preserving search ranking signals across canonical and AMP page pairs.

Built automated AMP validation into the deployment pipeline, preventing invalid AMP pages from reaching production.

Maintained AMP compliance across thousands of pages during a six-year engagement with continuous content updates.

Achieved consistent sub-2-second mobile load times, improving mobile search rankings and user experience for mobile visitors.

Business Impact

Automated AMP infrastructure that scaled across thousands of pages without manual intervention per page.

Improved mobile search rankings through valid AMP pages that met Google's mobile-first indexing requirements.

Consistent sub-2-second load times on mobile 3G connections, significantly improving mobile user experience.

Content synchronization that kept AMP pages automatically updated with canonical content changes.

Search-optimized dual-page architecture that preserved ranking signals while delivering AMP speed benefits.

Lessons Learned

AMP Requires Systematic Investment

AMP is not a one-time implementation — it requires ongoing maintenance, validation monitoring, and systematic tooling to stay compliant across a large content library.

Automation Is Essential for Scale

Manually creating AMP pages for each content update would have been impossible at scale. The WordPress hook-based automatic regeneration was the critical architectural decision.

SEO Benefits Require Correct Implementation

Improper rel=amphtml or rel=canonical implementation can split ranking signals between page pairs. Getting the bidirectional linking strategy right was essential for SEO success.

Validation Must Be Automated

AMP validation errors can appear from seemingly minor content changes — an embedded video, a new widget, or a stylesheet update. Automated validation in the deployment pipeline caught regressions before they reached production.

Gallery

AMP Articles
AMP Videos
AMP Branches
Validation Dashboard
Mobile Performance
Search Console
Architecture
Resume