A Design Pattern to Decouple Data from Markup

Abstract

Modern web applications have steadily increased in richness and complexity, and they put significant demands on system resources such as server CPU, memory and most importantly the network bandwidth. When seen at Internet scale, a tiny wastage in a resource can translate into a huge loss. For instance, we will show that youtube.com homepage can potentially save up to 4500 GB worth of bandwidth every day! It is, therefore, important for the application designers to: 1) identify what opportunities exist for improvement and 2) ensure that computing resources are efficiently utilized.

We present the results of an extensive investigation of how the useful information is distributed across various HTML tags and their attributes inside the served HTML pages taken from a large number of dynamic public websites. Our findings show that the useful information is often restricted to only a handful of the tags and attributes. We systematically explore the efficiency differences between various classes of frameworks that are used for developing modern web applications. Leveraging our findings, we propose a technique which decouples the view’s markup and data thus allowing them to travel separately and only on demand. This improves the web application efficiency; for instance our experiments show that this approach increased the throughput by a factor of about 7.