Four Kitchens

DevTools for mobile

2 Min. ReadDevelopment

Howdy perfers! In the US we’re gearing up for a long Thanksgiving weekend, so if you find yourself with some free time on your hands try digging into one of these awesome DevTools resources for mobile development.

Chrome Dev Summit mobile talks

Last week was the 2013 Chrome Dev Summit, so if you missed the action due to a busy work schedule, fear not. There are lots of slide decks to catch up on and a few videos too. Paul Irish brings us up to speed on the state of mobile web development, showing how you can use Chrome to emulate many more device properties such as pixel density, edit local dev environments from the browser using Workspaces, and a slew of performance tips thrown in as a bonus. Grab the slides, watch a video recorded previous to the dev summit, or read a longer article on HTML5 Rocks.

If you’re keen to optimize the critical rendering path but aren’t quite sure where to start, Bryan McQuade goes on a deep dive that walks you through that process. Many pieces are well-known frontend performance tips, but he helpfully explains how it affects the rendering of the page and hopefully brings some perspective on how much impact you can have to make a mobile site fast. Read the slides.

Paul Kinlan’s session about the Best UX patterns for mobile web apps explains how you can use some new UX tools within Google PageSpeed to help identify and resolve common problems that appear on responsive and mobile websites. I’ve appended the necessary query string ?ux=1 to the PageSpeed link so feel free to try your site out!

General reference

Just a reminder that you can always fond up to date information at both the Official Chrome DevTools docs and the Firefox Aurora devtools.