Extreme Web Performance for Mobile Devices

THIS TUTORIAL HAS REQUIREMENTS AND INSTRUCTIONS LISTED BELOW

In this tutorial we will go the first minutes through the state of the art in terms of mobile browsers available, including what do you don’t know about web browsers on Android today and what you should be aware of about Safari for iOS 7.×.

We will discuss how to measure mobile and responsive websites and how detect when you are harming badly the performance.

During the first practical section of this tutorial we will see the main techniques and tools available today using real mobile devices on stage, covering:

• Remote Inspector tools
• Traffic analyzers and bandwidth simulators
• Profiling tools
• When (not) to use emulators and simulators
• Tracking with the Web Navigation Timing API

Finally we will see examples of techniques that are harming the performance on mobile web and the tips to achieve Extreme Web Performance.

You will be able to test live on your own mobile device, including Vertical Scrolling

• 3D transforms and hardware acceleration
• Different viewport declarations
• JavaScript frameworks usage
• Web Storage vs. SQL Storage vs. IDB
• Large DOM vs iframes vs object pool
• SVG vs icon fonts vs responsive images
• Custom fonts loading
• Hacks to improve performance perception and responsiveness

After this tutorial you will get the full picture of HTML5 on mobile browsers today, how to measure performance on them and best practices to deliver the fastest experience on mobile browsers and webapp platforms.

You will be able to test and find issues on your own mobile or responsive websites while attending.

TUTORIAL REQUIREMENTS AND INSTRUCTIONS FOR ATTENDEES

Have a basic understanding of HTML and JavaScript