Did you know?? DevTools are the coolest. Honestly, I'm a certified fan of devtools, né developer tools - or Web Inspector if you're an type (who's Safari browser was the 1st to introduce the concept). In fact, you can do quite a bit of performance tooling in devtools alone, and I certainly keep a few versions open at all times - mostly Canary and FireFox.
Speaking of the latter, Firefox Developer Edition has been making some ongoing updates to their dev friendly client. A very recent update was for responsive design testing.
Testing on mobile, or non-desktop is absolutely important. The research data points to this as the direction of browsing - mobile. Responsive Web Design or RWD is a sibling of mobile, and not so distant cousin of performance. Performance is prime, and no place more so than for mobile. Then by association, we can state that RWD is a performance priority.
I like to discuss this, but in a conversation w/ an engineer from a well regarded CDN, he mentioned one of the biggest mistakes made he sees is image management, esp around mobile and resources being sent to smaller screens.
Enter Firefox Developer Edition and their Responsive Design Mode. Mozilla have made some updates so that devs can test their layouts and resource management.
Among the updates are:
- preset and popular device selection
- manual screen size editing
- pixel ratio selection (1x-3x)
- user agent selection
- window resizing
This is a short list of a few updates made, including the addition of touch events. Another must use as part of testing tooling in the Responsive Design Mode is network throttling or conditioning. This will also allow you to spot issues with an asset that might be loading slowly - and dial in on the hurdle at hand.
This quick video below and adjoining blog post highlights the updates.
Shortly after the announcements, comments and suggestions came pouring via the blog post and bugs were filed nearly in real time. See any bugs, or features you feel could be improved? Mozilla certainly invites bug reporting. Many more are set for 2017 release, like the "multi-viewport Responsive Design Mode" which will be nice, assuming your window will allow it (hello 12" users).