![Page 1: 1 Client-Side Includes: Fast Access to Dynamic Content Fragment 1 Fragment 2 Uses open ESI language to fragment pages –Exception handling –Conditional](https://reader035.vdocuments.mx/reader035/viewer/2022072014/56649e7c5503460f94b7ee17/html5/thumbnails/1.jpg)
1
Client-Side Includes: Fast Access to Dynamic ContentClient-Side Includes: Fast Access to Dynamic Content
Fragment 1
Fragment 2
• Uses open ESI language to fragment pages
– Exception handling
– Conditional inclusion
– Variable substitution
• Downloads changed fragments only
• Reassembles the page at the browser
• Uses open ESI language to fragment pages
– Exception handling
– Conditional inclusion
– Variable substitution
• Downloads changed fragments only
• Reassembles the page at the browser
![Page 2: 1 Client-Side Includes: Fast Access to Dynamic Content Fragment 1 Fragment 2 Uses open ESI language to fragment pages –Exception handling –Conditional](https://reader035.vdocuments.mx/reader035/viewer/2022072014/56649e7c5503460f94b7ee17/html5/thumbnails/2.jpg)
2
Improved PerformanceImproved Performance
Browser Edge server Origin server
GET /index.html
full page full page
GET /index.html
GET /index.html
full page frag2
GET /frag2.html
No ESI:
ESI:
CSI:
GET /frag2.htmlGET /frag2.html
frag2 frag2
(Boilerplate, frag1 cached)
(Boilerplate, frag1 cached)
Page reassembly
Page reassembly
![Page 3: 1 Client-Side Includes: Fast Access to Dynamic Content Fragment 1 Fragment 2 Uses open ESI language to fragment pages –Exception handling –Conditional](https://reader035.vdocuments.mx/reader035/viewer/2022072014/56649e7c5503460f94b7ee17/html5/thumbnails/3.jpg)
3
ImplementationImplementation
Typically satisfied from client’s cache
Browser Edge server Origin server
Obtain fragments Using HTTPObtain fragments using ActiveX
GET /home.html
wrapper
(cacheable, immutable for given page)
GET CSI Javascript (cacheable, same for all pages)
![Page 4: 1 Client-Side Includes: Fast Access to Dynamic Content Fragment 1 Fragment 2 Uses open ESI language to fragment pages –Exception handling –Conditional](https://reader035.vdocuments.mx/reader035/viewer/2022072014/56649e7c5503460f94b7ee17/html5/thumbnails/4.jpg)
4
BenefitsBenefits
• Improves user experiences. – Reduces amount of content transferred over the last mile
• No browser modifications or reconfiguration
• Reduces total cost for content providers by:– Reducing bandwidth consumption of origin server
– reducing amount of content served by CDN’s edge servers
• Improves user experiences. – Reduces amount of content transferred over the last mile
• No browser modifications or reconfiguration
• Reduces total cost for content providers by:– Reducing bandwidth consumption of origin server
– reducing amount of content served by CDN’s edge servers