posted 2 years ago in Dev Platform category by Jae Wan Jang
Velocity Conference (www.velocityconf.com), hosted by O’REILLY and sponsored by various enterprises, was first launched by web developers and operators of Silicon Valley in 2008. Now, Velocity has become a representative event as a venue for sharing ideas on how to "efficiently" develop and "seamlessly" operate mega web sites.
At NHN we have been participating in this conference since 2010. And this is my report on this year’s Velocity.
This year Velocity hosted over 2000 developers and operators which was more than last year. I think it is a reflection of ever-changing web-environment. Most of the participants were folks from Silicon Valley, while some from European countries as well as companies from Asian region such as Baidu, China's search engine monopolist. The number of sponsors was doubled (35) when compared to last year, which demonstrates that Velocity now is one of the important conferences.
While participating, I was able to get a glimpse of recent trends in web community, which can be categorized into 4 sectors
- Web Performance Optimization (WPO)
- Cloud Solutions
- Mobile Web
Optimization tools for Web-performance
The key component for WPO is a tool for measuring and monitoring web performance. This year at Velocity there were many talks about such tools. I had a chance to familiarize myself with the tools which provide added functions as well as some other tools that I am not well-aware of. Here are some of them.
Web Page Test
YSlow is a tool for providing information in order to improve Performance after thorough analysis on Yahoo-developed Web page. Before, only Firefox plug-in was available, however now it can also be used on Google Chrome. It is a new function for testing web-performance optimization.
Pagespeed is a tool to measure how fast a page loads. It can be used both online just like webpagetest.org, or on other sites through Page Speed API.
Chrome Developer Tool
Slowslow is a website for viewing performance index of YSlow, pagespeed and dynaTrace all at once. A new function allows the users to compare above index with Google analytics. Now it is possible to compare performance index and business index.
HTTP archive is a website for recording past and present web performance index of numerous websites utilizing documents on webpagetest.org. You may see the recent trends of Web. For instance, with this you will be able to know that the images in website are getting bigger these days. On top of this, there were more other interesting statistical results.
Other than above mentioned topics, Velocity presenters covered how to automatically test webpage using Selenium, how to emulate mobile network and extract Har file using BrowserMob proxy/Charles proxy. Also they introduced tools for collecting and analyzing Har file using Harpoon.
Applications of Web Performance Optimization
Google Instant Search
At Velocity 2011 Google introduced its Instant Search. One of the most brilliant idea was Prefetching capability by leveraging Hover-to-Click delay time. It is said that there is 200ms to 300ms of delay time from overring our mouse pointer to a certain link until we click and remove our finger. This fascinating idea was basically pulling HTML or image on the targeted link in a delay time.
Display Ad of Yahoo! Mail
Yahoo presented a case study on how to seamlessly present display ads on Yahoo mail (Web 2.0) without any business clash and still maintaining decent web performance. I was surprised to find out that after taking out advertisement from Yahoo mail (Web 1.0) temporarily, page loading speed enhanced by 73%. After discovering the fact, Yahoo had advertisers and agencies to use libraries necessary for running ads in order to load such ads more effectively. They also improved the logic of showing ads.
Here are the tips to optimize mobile Web. Optimizing mobile web is trickier than that of PC web. Since mobile devices come in various kinds and have considerably lower hardware performance, it is hard to optimize sites in such a way so that they are universally common on all devices. These reasons pushed to discover various optimization techniques. The following list provides some important tips for optimization.
- Downsizing to necessary HTML code, using semantic tip (header, footer, nav tag) of HTML5.
- Reducing request counts to server using inline images.
- Using ‘ontouchend’ event. 300 to 500 miliseconds faster than click event.
- Implement hidden parts to be lazy-loading.
- Use localStorage as cache.
All in all, the seminar on mobile concluded that it is best to run various tests on development stage for every device since mobile devices differs from one another. I believe, this was the reason for so much promotion of automatic solution for performance tests.
There were many optimization technology introduced for Android, an open source operating system for smartphones. I found the seminar on optimizing Android’s performance given by Qualcomm the most interesting.
When 3G network is not in use it automatically shuts down and takes more than 1 second to activate.
There are 4 threads processing HTTP transaction on entire Android. (As in the case of Nexus S).
Adopting HTTP pipelining sometimes leads to unexpected outcomes. Persistent cache (cache saved to flash) of Android devices operates cache eviction algorithm based on stated expiration data when receiving the object from a server.
I was able to find out that the performance of mobile device is not only affected by Webkit engine, the browser core, but also by network performance and the policies of operating system. This session implied that from now on in order to improve web performance, it is necessary to improve customers’ operating system along with browser.
- Avoid using eval and with (too slow).
- Do not create object within loop. Use Dense area.
- Besides the client side JS, server side JS using Node.JS was covered.
Outlook on Web Performance Optimization
In my perspective, the issues of web speed and performance have just begun to evolve. I felt a sense of relief and pride to find out that web-speed concerns, which I had often talked about and contemplated on with Service Speed Improvement Lab, Front-end Performance TF and many other teams at NHN, are equally dealt with in Silicon Valley, a home to Web. Even at this moment, many ideas and plans emerge. And Korea is not different. I also felt a grave sense of responsibility as NHN’s employee since I believe idea and planning for improving web speed is one of our responsibilities in this environment when IE users take up more than 90% of the total Internet users in Korea.
By Jae-wan Jang, Performance Engineering Lab, NHN Corporation.