Mastering Scalable Web Architecture: From Front‑End to Data Center

1. Front‑End Architecture

Front‑end covers the steps before a request reaches the application server, typically excluding business logic and dynamic content.

Browser Optimization Techniques

Improve page load and display by using page caching, HTTP request merging, and compression.

CDN

Content Delivery Networks deploy static assets in ISP data centers, delivering content via the shortest path to users.

Static‑Dynamic Separation

Static resources such as JS and CSS are hosted on dedicated servers or sub‑domains, separate from dynamic application servers.

Image Services

User‑uploaded images (product photos, avatars) are served from independent image server clusters with dedicated sub‑domains.

Reverse Proxy

Placed before application and static servers, reverse proxies provide page caching.

DNS

Domain name resolution can be used for load balancing and to point domains to CDN servers.

2. Application Layer Architecture

The application layer handles core business logic.

Frameworks

A good framework separates concerns, facilitates collaboration between designers and developers, and includes built‑in security measures.

Page Rendering

Dynamic content and static templates are combined to produce the final page presented to users.

Load Balancing

Multiple application servers form a cluster, distributing requests to handle high concurrency.

Session Management

Stateless application servers rely on external session stores to share user session data across the cluster.

Dynamic Page Staticization

High‑traffic, infrequently updated pages can be pre‑generated as static pages to benefit from caching, CDN, and reverse proxy optimizations.

Business Splitting

Complex business functions are divided into smaller, independently deployed services, reducing coupling and simplifying database sharding.

Virtualized Servers

Physical servers are virtualized into multiple VMs, allowing efficient resource use for lower‑traffic services.

3. Service Layer Architecture

Provides foundational services for the application layer.

Distributed Messaging

Message queues enable asynchronous communication and loose coupling between services.

Distributed Services

High‑performance, low‑coupling services support a Service‑Oriented Architecture (SOA).

Distributed Caching

Scalable cache clusters store hot data to improve website performance.

Distributed Configuration

Dynamic configuration pushes allow parameter changes without restarting servers.

4. Storage Layer Architecture

Handles persistent data and file storage.

Distributed File Systems

Large numbers of small files (images, webpages, videos) require scalable distributed file systems.

Relational Databases

Traditional business logic relies on relational databases, which can be accessed via routing layers for distributed access.

NoSQL Databases

Various NoSQL solutions offer advantages in memory management, data models, and clustering; HBase is highlighted as a strong choice.

Data Synchronization

Multi‑data‑center sites synchronize logs or write‑ahead logs to achieve consistent data across locations.

5. Backend Architecture

Handles non‑real‑time data processing and analysis.

Search Engine

Internal search requires periodic incremental and full indexing performed by background jobs.

Data Warehouse

Provides offline data analysis and mining services.

Recommendation System

Analyzes user‑item relationships to deliver personalized recommendations.

6. Data Collection and Monitoring

Collects and visualizes website traffic and system performance for operational decisions.

Browser Data Collection

Embedded JavaScript gathers client environment and interaction data.

Server Business Data Collection

Logs user requests and runtime metrics such as pending message counts.

Server Performance Data Collection

Metrics include system load, memory usage, and network traffic.

System Monitoring

Visual dashboards display collected metrics; advanced setups trigger automated remediation.

Alerting

Threshold breaches generate email, SMS, or voice alerts for engineer intervention.

7. Security Architecture

Protects the website from attacks and data leakage.

Web Attacks

Common threats include XSS and SQL injection, both mitigable with proper defenses.

Data Protection

Encrypt sensitive data in transit and at rest to safeguard assets.

8. Data‑Center Architecture

Large‑scale sites require massive server farms and careful physical design.

Facility Design

Power consumption for hundreds of thousands of servers can reach billions of RMB annually; location selection favors cooling efficiency and power availability.

Rack Design

Consider rack size, cabling, indicator lights, UPS, and voltage standards (48 V DC vs 220 V AC).

Server Design

Custom servers omit unnecessary peripherals and optimize layout for heat dissipation.