Moving EdgeSide Includes to the Real Edge the Clients

1
Moving Edge-Side Includes to the Real Edge the
Clients

• Zhen Xiao
• ATT Labs -- Research
• Joint work with Misha Rabinovich (ATT Labs
  Research),
• Fred Douglis (IBM T.J. Watson Research Center),
• Chuck Kalmanek (ATT Labs Research)

2
Motivation

• Exponential growth of Web traffic on the
  internet.
• Caching is essential for reducing network
  congestion and page display time.
• But more and more pages contain dynamic content.
• News headlines, stock quotes, time of day, etc..
• Bad for caching!

Problem how to facilitate caching for dynamic
content?
3
A Closer Look

• Dynamic pages are not all that dynamic
• Most bytes are in a static page template.
• Dynamic portions are a small fraction of the
  entire page.

4
full page 30731 bytes
news headlines 927 bytes (3)
Solution separate cache control for each
component of the page!
stock quotes 1231 bytes (4)
5
Edge-Side Includes (ESI)

• An XML-based mark-up language proposed in W3C
• http//www.w3.org/TR/esi-lang
• A mechanism for fragmenting a Web page into a set
  of components
• Example ltesiinclude srchttp//www.att.com/news
  .xml /gt
• Exception handling
• Conditional inclusion
• Separate cache control for each component
• Download changed fragments only
• Assemble the page at the edge servers (i.e.
  reverse proxies)

6
Comparison with HTML Tags

• IMG inclusion of images only
• APPLET inclusion of Java applets
• OBJECT generic inclusion of HTML code, but
• Not supported by any major browser yet
• Only allows a simple inclusion

7
ATT Page with ESI Mark-ups
http//www.att.com/index.html (Expires Feb 17,
1230)
http//www.att.com/index.html (Expires May 1,
1030)
Page template (seldom changes)
Page template (seldom changes)
ESI
News headlines (changes a few times day)
News Fragment (expires Feb 17, 1530)
ltesi include src/news.xml /gt
Stock quotes (changes every minute)
Stocks Fragment (Expires Feb 17, 1230)
ltesiinclude src/stocks.xml /gt
8
Akamais Approach for ESI-encoded Contents
Example A client fetches the ATT entry page.
Assume that only the stock quotes have changed in
the cache.
Origin server
Edge server
Browser
No ESI Encoding
(template, news cached)
With ESI Encoding
Page Assembly
9
Bottleneck of the Last Mile

• A large percentage of Internet users still rely
  on dial-up connections.
• Network traffic revenue analysis 79 of
  consumer subscribers as of March 2002.
• Jupiter Media Metrix, Aug 2001 59 of the
  predicated on-line households in the US in 2006.
• The speed of the last mile dominates the page
  display time.

ESI does NOT help dial-up customers!
10
Client-Side Includes Addressing the Last Mile

• Key idea Assemble page components in the
  clients browsers instead of on edge servers.
• Use existing technologies inside Internet
  Explorer
• Page parsing and assembly JavaScript
• Retrieval of page components ActiveX
• No browser modifications or reconfigurations
  necessary.
• Work well with or without a Content Distribution
  Network (CDN)!

11
Comparison of Page Assembly Alternatives
Edge server
Origin server
Browser
GET /www.att.com
GET /www.att.com
No ESI Encoding
Full page
Full page
Page Assembly
GET /www.att.com
GET /stocks.xml
With ESI
stocks
Full page
(template, news cached)
(template, news cached)
With CSI
Page Assembly
12
ESI versus CSI

• Same markup language (ESI)
• ESI
• Reduces content providers costs at origin server
  (less load and bandwidth).
• CSI
• Reduces content providers costs at origin server
  (less load and bandwidth).
• Reduces content providers costs for CDN (less
  bandwidth from edge to clients).
• Reduces bandwidth consumption over the last mile
• Reduces browser download times.

13
Implementation (with a CDN)
Edge server
Origin server
Browser
GET /www.att.com
Wrapper
Typically satisfied from clients cache
(cacheable, immutable for given page)
GET CSI Javascript
(cacheable, same for all pages)
Obtain fragments Using HTTP
Obtain fragments using ActiveX
14
Wrapper for JavaScript/ActiveX Implementations of
CSI
ltHTMLgt ltBODYgt ltSCRIPT SRCcsi.jsgtlt/SCRIPTgt
ltSCRIPTgtrun(template.html)lt/SCRIPTgt
lt/BODYgt lt/HTMLgt
15
Implementation (without a CDN)
Origin server
Browser
GET /www.att.com
Wrapper
Typically satisfied from clients cache
(cacheable, immutable for given page)
GET CSI Javascript
(cacheable, same for all pages)
Obtain fragments using ActiveX
16
What about non-IE browsers?

• No ActiveX
• Small fraction of all clients
• Solution CSI/ESI
• Optimize for the common case (MSIE browsers)
• JavaScript redirection
• Use CSI for MSIE ESI for the rest
• No performance benefit for non-IE users, but
  support them functionally

17
Wrapper choosing between client and server-side
page assembly
ltHTMLgt ltBODYgt ltSCRIPTgt lt!--
if (!window.ActiveXObject)
window.location /cgi-bin/esi.pl/template.html
// --gt lt/SCRIPTgt ltSCRIPT
SRCcsi.jsgtlt/SCRIPTgt ltSCRIPTgt lt!--
run(template.xml) //--gt
lt/SCRIPTgt If your browser does not support
JavaScript, please click ltA
href/cgi-bin/esi.pl/template.htmlgtherelt/Agt
lt/BODYgt lt/HTMLgt
18
Performance Evaluation

• Synthetic pages random generated contents
• Sizes 20K, 60K, 100K
• Template (80) four fragments (5 each)
• ATT page http//www.att.com
• Wall Street Journal page http//online.wsj.com
• One template, three fragments
• Network Connection 56K modem
• Server 864 MHz Pentium III, 256 MB memory,
  RedHat Linux 7.0, Apache 1.3.
• Client IBM T22 Thinkpad laptop, 1GHz CPU, 128MB
  memory, Windows 2000, Internet Explorer 6.0.

19
Sizes of ATT and WSJ Page with ESI encoding
All numbers are in bytes
20
Download Time of Synthetic Pages
Conclusion substantial improvement in display
time in the common case
21
Download Time of ATT Page
22
Download Time of WSJ Page
23
Related Work

• XInclude http//www.w3.org/TR/xinclude
• Not supported by any major browser
• Requires the template and fragments be valid XML
  pages
• Server-side includes ASP, JSP, PHP
• Easy management of the Web site
• No reduction in bandwidth consumption
• HPP closest to our work
• Implemented as a browser plug-in
• Supports loop construct
• Delta-encoding

24
Benefits of CSI

• Improves user experience.
• 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 CDNs edge
  servers.
• Extends benefits of ESI to content providers who
  do not use a CDN.