Shan Lu, Junwen Yang and Chengcheng Wan receive their Distinguished Paper Award at ICSE. (Photo courtesy ACM/IEEE)
Shan Lu, Junwen Yang and Chengcheng Wan receive their Distinguished Paper Award at ICSE. (Photo courtesy ACM/IEEE)

As web applications grow more complex and data-intensive, developers may feel like they’ve lost control of a fundamental property: how fast the site loads. Website features that look simple on the surface, such as the number of archived emails or a social media sidebar, can actually involve complicated data queries under the hood, which could slow performance to a crawl. On the developer side, these features may stem from only a single line of code, creating significant speed bumps that aren’t easily spotted.

To help developers find and fix these slowdowns, University of Chicago CS researchers in the laboratory of Associate Professor Shan Lu created Panorama, an interactive environment that optimizes web applications. A paper on the tool presented last month at the 2019 International Conference on Software Engineering (ICSE) received one of only 11 Distinguished Paper Awards from the judges. Authors on the paper include UChicago CS graduate students Junwen Yang and Chengcheng Wan, as well as Cong Yan and Alvin Cheung of the University of Washington.

Panorama is the latest chapter of a longer project investigating and mitigating the most common issues that plague database-backed web applications. A study presented at last year’s ICSE identified several “anti-patterns” that slow the performance of these apps, and unveiled PowerStation, a tool for fixing slow API calls. But where these changes could be automatically implemented behind the scenes, with no visible effect on the look of the application, other common slowdowns stem from the design of the website itself, requiring a more interactive tool for developers.

“In general, there are two type of things you can do to improve performance. One is you don't change any external view, so as a user, it’s free lunch, it's just faster and nothing else has changed,” Lu said. “But there's only very limited free lunch. For other changes, the webpage will actually be different, but it will be much, much faster. But we need to be more careful, because you don't want to just automatically throw away things and say, now it's faster.”

As a result, Panorama was designed as a “view-centric” environment for developers. After the algorithm has analyzed the application’s HTML code for potential issues, it creates a heatmap view of the website, with each element color-coded according to how fast or slow it loads. Developers can easily spot the worst slowdown culprits in the context of what users see when they visit the site, and access proposed fixes as well.

“We show you the performance cost for the front web pages, and then we also provide the optimization opportunities,” said Yang, the paper’s first author. “You can click on the opportunity, and we show you the new designed page with the new estimated performance cost. You can also redo to withdraw your optimizations.”

Many of the fixes are relatively simple concepts; for instance, returning the results of a search in paginated form instead of all at once, or returning a summary figure instead of an exact number, such as “you have 10,000+ emails” instead of “you have 14,873 emails.” Others are more complicated to implement, such as asynchronous loading of elements so that users can view fast-loading content while waiting for slower items to appear. And one of the most crude solutions — simply removing the slowest elements — can break a website or render it useless if done carelessly.

For these changes, Panorama does the hard work on the technical end, making changes across different files to account for any cross-dependencies. That leaves the developer free to make the higher-level decisions about whether the performance improvement of a particular design change makes up for any potential loss of functionality.

The effect of these fixes was significant, improving performance by an average of 450 percent, and in one case causing a page to load 38 times faster. To assess whether these optimizations actually improved user experience, the authors conducted a user study, showing volunteers websites before and after the Panorama changes. Many participants preferred the new design, and those who said they didn’t notice any difference were also considered a win by the researchers.

“Even if the user says the two pages are similar, with our optimization it's still better, because we actually save the server time,” Lu said. “For the web company, it's almost like you can use fewer machines, you can pay fewer utility bills, and the user wouldn't see any difference. So it's a huge win.”

Though Panorama currently only works for web applications written with the Ruby on Rails framework, the researchers said that the algorithms behind it could be adapted to work with other popular web development tools. For now, they’re trying to spread the word about the tool to the developer community, hoping that it will become an essential part of their workbench in designing new applications.

“We hope that we can show developers this tool and get feedback from them,” Lu said. “In terms of the research, I think we have addressed the most important problems that we identified. But I think it depends on the developer to judge how well we have addressed them.”

Related News

More UChicago CS stories from this research area.
Haifeng Xu
UChicago CS News

New CS and DSI Faculty Haifeng Xu Brings Strategic Intelligence to NeurIPS 2022

Nov 28, 2022
UChicago CS News

UChicago CS Research Finds New Angle on Database Query Processing with Geometry

Nov 08, 2022
UChicago CS News

Asst. Prof. Aloni Cohen Receives Award For Revealing Flaws in Deidentifying Data

Sep 09, 2022
UChicago CS News

UChicago Hosts NSF Workshop on Frontiers of Quantum Advantage

Aug 15, 2022
UChicago CS News

New 2022-23 Faculty Add Expertise in Linguistics, Visualization, Economics, and Data Science Education

Aug 11, 2022
In the News

UChicago Co-Leads $10 Million NSF Institute on Foundations of Data Science

Aug 09, 2022
UChicago CS News

UChicago CS Faculty Receive Industry Grants From J.P. Morgan, Google

Jul 19, 2022
In the News

Bill Fefferman Comments on New Standards for Quantum-Proof Cryptography

Jul 07, 2022
UChicago CS News

UChicago London Colloquium Features Data Science, Quantum Research

Jul 01, 2022
UChicago CS News

Faculty Bill Fefferman and Chenhao Tan Receive Google Research Scholar Awards

Jun 21, 2022
UChicago CS News

UChicago CS Chair Michael Franklin Part of SIGMOD Award-Winning Team

Jun 15, 2022
Video

Data Science Institute Summit

Jun 15, 2022
arrow-down-largearrow-left-largearrow-right-large-greyarrow-right-large-yellowarrow-right-largearrow-right-smallbutton-arrowclosedocumentfacebookfacet-arrow-down-whitefacet-arrow-downPage 1CheckedCheckedicon-apple-t5backgroundLayer 1icon-google-t5icon-office365-t5icon-outlook-t5backgroundLayer 1icon-outlookcom-t5backgroundLayer 1icon-yahoo-t5backgroundLayer 1internal-yellowinternalintranetlinkedinlinkoutpauseplaypresentationsearch-bluesearchshareslider-arrow-nextslider-arrow-prevtwittervideoyoutube