How eBay Optimized JS/CSS Bundling to Boost Browser Caching and Performance
eBay reduced HTTP requests and improved caching by splitting its monolithic JS/CSS bundles into shared core libraries, domain‑specific common resources, and page‑specific assets, creating a three‑tier packaging strategy that balances load, consistency, and manageability across its multi‑domain site.
Background
eBay originally packaged all JavaScript needed for a page into a single JS file placed at the bottom of the page and all CSS into a single CSS file in the <head>. This approach dramatically reduced the number of HTTP requests but prevented effective browser caching.
For example, page A loads A.js (which contains jquery.js and logic_a.js), while page B loads B.js (containing jquery.js and logic_b.js). Both files include jquery.js, yet each page must download its own copy, so the cache cannot be reused.
Optimization Idea
The solution is to split resources into a common core package and independent packages . The common core contains libraries used across the entire site, while each page or sub‑domain keeps its own specific code separate.
Benefits
Browser caching : The shared core library can be cached site‑wide, greatly improving performance.
Consistency : A unified core ensures that UI components and behavior are consistent across pages.
Easier management : Core files can be maintained in one place.
Further Splitting by Sub‑Domain
eBay’s platform consists of multiple sub‑domains (shopping, selling, browsing, etc.). Within each sub‑domain, resources are divided into:
Domain‑common resources : JS/CSS that are identical for all requests in that sub‑domain and can be cached together.
Personalized resources : Assets tightly coupled with request parameters, such as page‑specific business logic.
Resulting Packaging Strategy
Each page ends up loading six resource files: three JavaScript files and three CSS files.
Core library : Shared across the entire site, highest load.
Sub‑domain common resources : Shared within a sub‑domain, medium load.
Page‑specific resources : Unique to each page, lowest load.
eBay concluded that this three‑tier packaging strategy best balances request count and browser caching for their large, multi‑domain site.
Signed-in readers can open the original source through BestHub's protected redirect.
This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactand we will review it promptly.
Java High-Performance Architecture
Sharing Java development articles and resources, including SSM architecture and the Spring ecosystem (Spring Boot, Spring Cloud, MyBatis, Dubbo, Docker), Zookeeper, Redis, architecture design, microservices, message queues, Git, etc.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.