EdgeCast Edge Optimizer improves performance by modifying web pages based on Google PageSpeedPosted: March 28, 2013
EdgeCast Edge Optimizer
How to speed up your web pages?
1.move/cache your content closer to your users to reduce TCP/IP latency and increase transmission speed
2.optimize TCP/IP network paths & communications to reduce latency and increase speed
3.modify web pages to decrease amount of data and number of assets
CDN is doing #1. More mature and advanced CDN provides #2 and #3 too. EdgeCast Application Delivery Network (ADN) and Edge Optimizer improve web page performance by the means of #2 and #3 respectively.
Dynamic content cannot be practically/effectively cached because a dynamic asset previously generated by a web application would never be requested again. ADN finds other ways through which to speed up data delivery to clients. ADN is able to drastically reduce the amount of time that it takes to communicate with the origin server by optimizing the network path and through the use of both server efficiency and RFC-compliant protocol optimizations. This allows these dedicated servers to transmit dynamic data at a much faster rate than traditional Internet data routes.
Edge Optimizer modifies the web pages being delivered to clients. The most common performance benefits that these modifications can achieve are to decrease the amount of data that needs to be transferred and the number of assets required to properly load your web page. In turn, this allows data delivery efficiency improvement without requiring modification to the original source code. The following illustration indicates how a website can be streamlined through Edge Optimizer.
Edge Optimizer modifies web pages based on Google PageSpeed. It modifies web pages with five sets of filters:
-HTML Rewriters: modifies HTML code to reduce bytes transferred and number of assets that need to be requested
-CSS Rewriters: modifies inline and referenced CSS
-Image Rewriters: transform images and the HTML code used to reference them
-Cacheability: modifies HTML code to increase the cache policy assigned to referenced content
I use this simple original webpage to demonstrate how Edge Optimizer improves performance. First of all I run a Webpagetest to analyse the original webpage and to identify potential areas of improvement. Here is the Webpagetest result of the original webpage:
From the waterfall diagram I find a large portion of page load time is caused by a few images (items 4, 5, 9 and 12). I configure Edge Optimizer HTML Rewriters to remove comments from the HTML page and Image Rewriters to compress some images. EdgeCast GUI is very user-friendly and powerful and it takes me a few minutes to complete the configuration. This is the optimized webpage. Here is the Webpagetest result of the optimized webpage:
A quick comparison of the Webpagetest results:
|Number of HTTP assets||21||21||nil|
|Total Page Size (KB)||865||313||-64%|
|Document Complete Time (sec)||5.559||1.763||-68%|
68% reduction in document complete time!
From the Webpagetest result I identify four objects are optimized by and delivered from EdgeCast ADN:
- HTML page is reduced from 6.2KB to 5.9KB (item 1)
- image avatar.jpg is compressed from 34.8KB to 3.9K (item 3)
- image happystreet.png is converted from a 662.5KB PNG to 141.7KB JPEG (item 4)
- image 08487_footerMdotLogo.png is compressed from 3.1KB to 2.5KB (item 7)
Besides page size and load time improvements, the optimized webpage scores higher PageSpeed and YSlow grades than the original webpage according to GTmetrix.
Further improvement is possible. For examples:
- add more Edge Optimizer filters, such as Inline Images filter to reduce number of assets
- cache non-compressible images
- both (1) & (2)
|Number of HTTP assets||19||21||19|
|Total Page Size (KB)||318||313||318|
|Document Complete Time (sec)||1.691||1.431||1.039|
|Document Complete Time vs Original||-70%||-74%||-81%|
EdgeCast Edge Optimizer is a great and quick solution to improve performance, especially for dynamic webpages which are not easy to modify manually.