Case Study

Angel One

Enterprise Stock Trading & Investment Platform

Role: Senior Full-Stack DeveloperDuration: July 2018 – June 2024Industry: FinTechPlatform: Web Platform
JavaScriptPHPWordPressFoundationVue.jsApexChartsRedisElasticsearchDockerAWSNode-REDGoogle Apps ScriptAmazon PollyWebpackGulpREST APIsMySQLGit

Project Overview

Angel One is one of India's largest digital investment platforms, serving millions of users with stock trading, mutual funds, IPOs, ETFs, portfolio management, and financial education. Over a six-year engagement, I worked as a Senior Full-Stack Developer responsible for the custom WordPress theme architecture, REST API integrations, performance optimization, search infrastructure, and automation systems that powered the platform.

The engineering scope spanned 104+ theme files, 68 template parts, 24 library modules, 30+ custom shortcodes, 20 custom REST API endpoints, 24 Node-RED automation flows, and integration with real-time financial data sources — all serving millions of monthly visitors with consistent performance and reliability.

My Role

Lead Frontend Development
Custom WordPress Theme
Architecture Planning
Performance Optimization
REST API Development
Node-RED Automation
Elasticsearch Integration
Amazon Polly Integration
Google Apps Script Automation
Real-time Data Integration
AMP Implementation
Lead Generation Systems
Cross-team Collaboration
Sprint Planning
Code Reviews
Mentoring

Engineering Challenges & Solutions

01

High-Traffic Performance

Maintaining fast page loads and reliable uptime for a platform serving millions of monthly visitors, with real-time stock data updates during market hours.

Solution: Multi-layer Caching

Implemented Redis caching, full-page cache via W3 Total Cache, and browser-level asset caching with CDN distribution through Cloudflare.

02

Complex WordPress Architecture

Managing a large-scale WordPress installation with 20+ custom post types, 50+ custom taxonomies, hundreds of template files, and multiple content workflows.

Solution: Modular Theme Architecture

Designed a component-based WordPress theme with 68 template parts, 24 library modules, and a custom Gutenberg-style shortcode system for reusable content blocks.

03

Real-time Financial Data

Integrating live stock prices, OHLCV charts, LTP data, and market indices from multiple backend APIs while maintaining page performance.

Solution: Custom API Proxy Layer

Built a PHP proxy layer for stock data APIs (Angel OpenAPI, ChartQ, MCX/NCDEX) with server-side caching, reducing client-side processing and API call frequency.

04

Enterprise Search

Delivering fast, relevant full-text search across diverse content types — knowledge articles, research reports, stock profiles, and educational videos.

Solution: Elasticsearch with FacetWP

Deployed Elasticsearch on the WordPress backend with FacetWP for faceted search across research reports, stock profiles, and educational content.

05

Content Scalability

Supporting hundreds of landing pages, marketing campaigns, and dynamic content templates without degrading performance or developer velocity.

Solution: Dynamic Shortcode System

Built a library of 30+ custom shortcodes for accordions, charts, branch locators, research tables, and live blog feeds that content editors could assemble into pages.

06

SEO & Dynamic Content

Maintaining strong search visibility while rendering real-time financial data, stock pages, and dynamically generated investment content.

Solution: Critical CSS Pipeline

Built a critical CSS generation system that extracted above-the-fold styles per page template, stored them in the database, and served them inline with Server-Timing headers.

07

AMP & Mobile Performance

Building and maintaining AMP versions of key pages — knowledge center, educational videos, branches — while synchronizing content with canonical pages.

Solution: AMP Automation Framework

Developed an automated AMP conversion pipeline that generated valid AMP pages for posts, educational videos, and branch pages from canonical WordPress content.

08

Automation at Scale

Automating data import workflows for stock prices, mutual funds, US equities, announcements, and glossary content across multiple systems.

Solution: Node-RED Automation Backend

Designed and deployed 24 Node-RED automation flows for stock data imports, ETF updates, announcement processing, glossary imports, margin calculations, and cache management.

Architecture

Users
Cloudflare CDN
Load Balancer
Nginx
WordPress + Foundation
REST APIs
Redis Cache
Elasticsearch
AWS Services
MySQL Database
Monitoring & Analytics

Feature Highlights

Live Stock Prices
OHLCV Charts
ARQ Risk Profiling
Mutual Fund Research
US Stocks & ETFs
Branch Locator
IPO Listings
Educational Videos
Research Reports
AMP Pages
Lead Forms
Live Blog Platform
Podcast Library
Glossary
Support FAQs
Partner Registration

Performance Engineering

Critical CSS

Database-stored critical path CSS generated per page template and served inline, eliminating render-blocking stylesheet requests.

Async CSS Loading

Non-critical CSS deferred via requestAnimationFrame and user interaction triggers, reducing initial payload.

JavaScript Optimization

Legacy scripts conditionally loaded per page, Foundation plugins lazily initialized, third-party scripts deferred.

Asset Revisioning

Static assets fingerprinted via gulp-rev for aggressive cache busting without manual version management.

Image Optimization

Automated compression pipeline via Gulp imagemin with responsive image sizing and CDN delivery.

CDN Distribution

Static assets served through dedicated CDN subdomain (w3assets.angelone.in) with long cache headers.

Automation & Node-RED Backend

Deployed a Node-RED automation backend with 24 production flows handling stock data imports, ETF updates, announcement processing, glossary imports, margin calculations, and cache management — eliminating manual data entry across the platform.

Stock Master Google Sheets sync — automated stock data import from spreadsheets into WordPress.
SM Company bulk import — batch import of 10,000+ share market company profiles with category mapping.
Vested US Stocks & ETFs data updater — automated price and portfolio data sync via Vested API.
Announcement v3 import — real-time corporate announcement ingestion from Angel MF API.
Critical CSS helper flow — triggered regeneration of critical CSS on content publish.
Margin calculator data import — futures and options margin data synchronized daily.
Permalink Google Sheets builder — automated slug and permalink generation for new content types.
Career importer — automated job listing import from external ATS systems.

Search Infrastructure

Replaced default WordPress search with Elasticsearch powered by FacetWP, delivering fast, faceted search across knowledge center articles, blog posts, research reports, stock company profiles, and podcast episodes with custom keyword mapping for high-intent financial queries.

Elasticsearch-powered unified search across knowledge center, blog, stocks, research, and podcasts.
Faceted filtering by content type, category, and date via FacetWP integration.
Custom keyword mapping for high-intent financial queries with autocomplete suggestions.
AMP-compatible search results for mobile users with instant-loading pages.

Technology Stack

JavaScriptPHPWordPressFoundationVue.jsApexChartsRedisElasticsearchDockerAWSNode-REDGoogle Apps ScriptAmazon PollyREST APIsWebpackGulpGitMySQLSCSSComposerHTML5jQueryYAML

Development Workflow

1
Requirements
2
Architecture
3
Sprint Planning
4
Development
5
Testing
6
Performance Audit
7
Code Review
8
Deployment
9
Monitoring

Engineering Contributions

Designed and built the custom WordPress theme architecture from the ground up, serving as the foundation for Angel One's public web platform over a six-year engagement.

Developed 30+ custom shortcodes and 68 template parts that enabled content teams to build diverse page layouts without engineering involvement.

Architected a multi-source real-time data integration layer — Angel OpenAPI, ChartQ, MCX/NCDEX, Vested API — with server-side caching and resilient error handling.

Integrated Elasticsearch with FacetWP, replacing default WordPress search with fast, faceted search across the entire financial content library.

Built a Node-RED automation backend with 24 production flows, automating stock data imports, ETF updates, announcement processing, and cache management.

Implemented a critical CSS generation and serving pipeline that eliminated render-blocking stylesheets across all page templates.

Developed an automated AMP conversion framework that generated valid AMP pages for posts, videos, and branch listings from canonical content.

Created Google Apps Script automations for PageSpeed reporting and Google Sheets data synchronization across the engineering team.

Led migration of the website from Angel Broking to Angel One branding, ensuring zero downtime and preserved SEO during the transition.

Mentored junior developers through structured code reviews, documentation, and pair programming sessions.

Business Impact

Enterprise-grade platform stability supporting millions of monthly visitors with 99.9% uptime across six years of continuous operation.

Scalable content architecture that enabled the marketing team to launch hundreds of campaign landing pages without engineering bottlenecks.

Improved maintainability through modular theme architecture, standardized shortcode system, and comprehensive documentation.

Optimized user experience with consistent 90+ PageSpeed scores, AMP mobile pages, and responsive design across all devices.

Search infrastructure that delivered fast, relevant results across the entire financial content library, improving content discoverability.

Automated data workflows that eliminated manual data entry for stock prices, mutual funds, announcements, and glossary content.

Production-ready API layer handling thousands of real-time stock data requests per minute during peak market hours.

Long-term platform stability maintained through continuous refactoring, performance monitoring, and systematic technical debt reduction.

Lessons Learned

Modular Architecture Compounds

Investing in a component-based theme with clear separation of concerns — template parts, library modules, shortcodes — meant that six years in, adding a new feature was still as fast as year one.

Performance Is a Continuous Practice

Maintaining 90+ PageSpeed scores across hundreds of templates required systematic auditing, automated monitoring via Google Sheets, and a culture of incremental optimization in every sprint.

Automation Is an Engineering Multiplier

The 24 Node-RED flows and custom cron scripts automated data workflows that would have required a dedicated operations team. Every hour spent on automation saved days of manual work.

Search Deserves First-Class Investment

Replacing default WordPress search with Elasticsearch was one of the highest-impact engineering decisions. The improvement in content discoverability directly affected user engagement metrics.

Balance Flexibility with Constraints

The shortcode system gave content teams freedom while enforcing performance budgets and design consistency. The right level of constraint enabled speed without sacrificing quality.

Real-time Data Requires Real Architecture

Serving live stock prices through WordPress taught me that financial data integration needs its own caching layer, proxy architecture, and error handling — separate from the CMS.

Gallery

Homepage
Stock Pages
Research Reports
AMP Articles
Branch Locator
Mutual Funds
Mobile Views
Architecture
Resume