Addy Osmani's Blog, page 6
November 23, 2013
Mobile Web Development Tooling (Slides)
In my mobile web dev. tooling slides, we dive into the options available today for cross-device development, testing, and performance evaluation of multi-device webapps. Understand how best to develop with immediate feedback from the mobile devices you’re targeting, scale up … Continue reading →
November 19, 2013
DevTools: Incrementing CSS values under-the-cursor
Chrome DevTools supports some useful keyboard shortcuts for easily incrementing or decrementing CSS values under-the-cursor. Shortcuts are available for both the Sources and Elements panels in Canary. In this quick 59s video, I walk through how to effectively use them. … Continue reading →
Rendering Performance Case Studies (G+, Flickr And More)
Miss my workshop at Velocity Europe? The slides are now up!. These days our users expect smooth scrolling, buttery smooth animations and interactions, especially on mobile. We need to start caring about not just how quickly our sites load but … Continue reading →
November 16, 2013
Slides: Automating Front-end Workflow
Writing a modern web app these days can sometimes feel like a tedious process; frameworks, boilerplates, abstractions, dependency management, build processes..the list of requirements for a front-end workflow appears to grow each year. What if however, you could automate a … Continue reading →
October 20, 2013
The future of data-binding is Object.observe()
Object.observe() is a proposed mechanism for bringing true data-binding to the browser. It exposes a mechanism for observing changes to objects and arrays, notifying others of mutations made to these objects. In my JSConf talk on O.o() I walk developers … Continue reading →
October 12, 2013
Building WebApps With Yeoman And Polymer
♡ Web Components? I just published a brand new tutorial over on HTML5Rocks walking through how to build webapps with Yeoman and Polymer. Catching up on Web Components Now you might be wondering..hold up. I’m not sure what Web Components … Continue reading →
October 8, 2013
Video: Gone In 60fps – Making A Site Jank-Free
Introduction What’s stopping your web pages from getting silky smooth scrolling, buttery animation and a user experience that’s snappy and fast? Jank-free rendering performance has been shown to positively affect user engagement and experience in many large sites, but remains … Continue reading →
October 3, 2013
A Yeoman prompt to install Twitter Bootstrap for CSS, Sass, Less or Stylus
In this video, I walk through generator-bootstrap – an uber-simple Yeoman generator which prompts you for the flavour of Twitter Bootstrap you would like to install for a project: CSS only, Sass, Less or Stylus. It’s a nice time-saver. You … Continue reading →
October 2, 2013
5 Minutes With Yeoman
I recorded a quick video on getting started with Yeoman for anyone new to the project : ) You might also find building apps with the Yeoman workflow a helpful read.
DevTools JavaScript Memory Profiling
Yesterday I published a refreshed guide to plugging memory leaks over on the Chrome DevTools docs site. It covers the Object allocation tracker, timeline memory, heap profiles and a few other bits and pieces. I hope you find it useful!
