Optimizing Mobile Web
Not all apps on our smartphones are created equal, just like how not all network technologies work the same. Some perform great and some not as much, but do we know how each one differs from the other? The other day I was discussing mobile applications with my wife who is a mobile developer when I realized that we as telecom network architects pay so little attention to the details of the design of mobile applications and their performance. It is not always about coverage and getting the best signal – indoors or outdoors. I was always aware of the implications of a badly designed mobile application going rogue as we had seen that a few years ago with Android launch or a recent topic of NTT DO CO MO asking for help from Google. The rules for development have changed significantly and they are here to stay, as Apple goes into mobile publication and Amazon has democratized publication. I am all for democratization of the Mobile web – it is all about you – the user. The fundamentals of Mobile web design are – great UI, good performance and good experience.
Networks have been built on the premise of – we build and they will come. It was the years before Apple and Google made their foray into wireless. A recent report says that there will be more smartphones than humans by the end of this year! What will that mean from a network perspective? It definitely bodes well for operators who are in it to make money, but will it kill their network with congestion? IPhone has definitely not helped the MNOs in monetizing terms.
3GPP and other standard bodies have worked on making the network ‘intelligent’ enough based on standardizing some of the network interfaces and behavior. Here is a nice little calculator for data caps that come with your wireless subscription.
QOS and QOE: QoS and QoE are so interdependent that they have to be studied and managed with a common understanding, from planning to implementation and engineering (optimization). The aim of the network and services should be to achieve the maximum user rating (QoE), while network quality (QoS) is the main building block for reaching that goal effectively. QoE, however, is not just limited to the technical performance of the network; there are also non-technical aspects, which influence the overall user perception to a great deal. Most infrastructure vendors now have built their hardware compatible to the strict QOS policies as defined by 3GPP.
Latency Reduction: Flatter architecture with some of the functions of the RNC moving to the eNodeB & MME along with a complete re-designs of the air interface with OFDMA replacing W-CDMA air interface. Also the all-IP transport and core has reduced the latency of the packet round-trip times as compared to previous generation of wireless networks. All the efforts that operators have done for years optimizing the Fiber to cell efforts will now pay off with LTE, as the Radio interface gets more bandwidth to accommodate more users and applications.
Spectral Efficiency: The reason technologies such as OFDMA are attractive is that they allow higher spectral efficiency with lower overall complexity; thus their use in technologies such as LTE and WiMAX. The roadmap for the EDGE/HSPA/LTE family of technologies provides a wide portfolio of options to increase spectral efficiency. When determining the best area on which to focus future technology enhancements, it is interesting to note that HSDPA, 1xEV-DO, and IEEE 802.16e-2005 all have highly optimized links—that is, physical layers.
Channel Bonding: Dual carrier operation has been promoted in the 3GPP standardization by Qualcomm and Ericsson, and a RAN1/4 Study Item (SI) entitled “Feasibility Study on Dual Cell HSDPA Operation” was proposed and approved in TSG RAN #39. In TSG RAN #40 the SI was further maintained considering the good progress status, and a Work Item (WI) entitled “Dual-Cell HSDPA Operation on Adjacent Carriers” was approved. Further enhanced multi-carrier HSDPA operation is being specified for Rel-10, where the base station will be able to schedule HSDPA transmissions over three or four carriers simultaneously to a single user with the carriers are spread over one or two frequency bands. Solutions specified in earlier releases can be reused to a large extent. The difference is that now it is possible to configure a UE with one primary serving cell and up to three secondary serving cells.
MIMO: (Multiple Input Multiple Output) is an antenna technology that is used both in transmission and receiver equipment for wireless radio communication. There can be various MIMO configurations. MIMO takes advantage of multi-path and uses multiple antennas to send multiple parallel signals (from transmitter). In an urban environment, these signals will bounce off trees, buildings, etc. and continue on their way to their destination (the receiver) but in different directions. “Multi-path” occurs when the different signals arrive at the receiver at various times. With MIMO, the receiving end uses an algorithm or special signal processing to sort out the multiple signals to produce one signal that has the originally transmitted data.
Application Design Optimization
The new challenge to optimize the performance of the Internet is “ideally” to provide for mobile users a near zero latency experience to the Mobile Web. While for the last two decades, optimization was about a faster network and faster servers, optimization for this decade is about faster content from faster Web sites. In other words, optimizing the Mobile Web requires mostly optimizing the content both in the network and at the Web site. Most of the initial requirements to reengineering the fabric of the wireline Internet by increasing significantly its bandwidth and improving its data transmission have been accomplished, although new enhancements will certainly continue.
Now, the new challenges are first to optimize the content to provide a similar experience as the one that users expect on wireline networks while the bandwidth of the wireless network is still being limited. Second as the number of users is increasing especially for the Mobile Web (but as well for the wireline Internet), Web sites must always be optimized to accommodate a larger number of users distributed geographically over the world. According to Yahoo, a 400 ms slower Web can translate from 5 to 9% drop in full-page traffic.
There are two complementary approaches to optimize the Mobile Web: network operators can optimize the mobile content in their networks, and content providers can optimize their Web content. And, in general the more the faster!
Optimizing the Web Traffic for the Mobile Web:
On wireless networks, video is the dominant driver of the Web traffic and can produce up to 40% of the traffic. Most of the video traffic, at any given time, is driven by a small number of videos that are downloaded by a very large number of users.
But even the bandwidth of 4G/LTE networks (5 to 12 Mb/s downlink – 2 to 5 Mb/s uplink) is not enough to accommodate the growth of the media traffic. If the traffic is not routed over Wi-Fi networks (802.11n can provide up to 600 Mb/s), the media must be compressed in the network.
Network optimization of the mobile Web is performed by an inline HTTP proxy (identical to a firewall application proxy). The majority of the data compression is achieved through lossless and lossy optimization at the content layer while some level of data reduction can be achieved at the application layer (such as parallelization of content downloads), and at the transport layer (such as aggregation of TCP tunnels in particular if a client is used at the subscriber’s device).
The Web media (e.g. the video and audio) can be lossy optimized as images included in a Web page. Lossy media optimization involving generally the transcoding and lower frame rates of the media. The average data reduction in HTTP video bytes for a smartphone can be from 15 to 30% for lossless optimization, and from 0% to 35% for lossy optimization.
Optimizing Web Sites for the Mobile Web:
- Make Fewer HTTP Requests
- Use a Content Delivery Network (CDN)
- Add Expires or Cache-Control Header
- Gzip Components
- Put Stylesheets at Top
- Put Scripts at Bottom
- Avoid CSS Expressions
- Reduce DNS Lookups
- Avoid Redirects
- Remove Duplicate Scripts
- Configure ETag
- Make Ajax Cacheable
- Flush Buffer Early
- Use GET for Ajax Requests
- Postload Components
- Preload Components
- Reduce the Number of DOM Elements
- Split Components Across Domains
- Minimize Number of iframes
- Avoid 404s
- Reduce Cookie Size
- Use Cookie-Free Domains for Components
- Minimize DOM Access
- Develop Smart Event Handlers
- Choose <link> Over @import
- Avoid Filters
- Optimize Images
- Optimize CSS Sprites
- Do Not Scale Images in HTML
- Make favicon.ico Small and Cacheable
- Keep Components Under 25 KB
- Pack Components Into a Multipart Document
- Avoid Empty Image src