Today’s Readings

Fascinating look at JavaScript parse and execution times across various devices. While these tests are based on jQuery, it gives a glaring insight into the variances your users will see depending on the device and browser they are using. Absolutely amazing!

With performance on our minds, offers us Critical, a Grunt or Gulp process that takes screen sizes via a config, determines and outputs the CSS required to render the critical CSS for the screen size, then lets you push that critical CSS into the page’s mark-up to be delivered to the device; the rest of the CSS can then be delivered via an external stylesheet. Seriously freaking awesome!

And for more on optimizing for the critical path, check-out ‘s presentation on the subject!

As a kid I loved Saturday morning cartoons! (Who am I kidding, I still love cartoons!) So when I saw these Æsop’s Fables written using Google Fonts, I was it with a wave of nostalgia… Nice fonts, too. :-)

3 Essential Sublime Text Plugins for Node & JavaScript Developers

Not sure I’d say the slight highlighting differences make JavaScriptNext essential, but there’s no arguing that JSHint is, and JsFormat will certainly save me lots of trips to jsbeautifier.org

5 Array Methods That You Should Be Using Now

Similarly, not sure I can throw my full support behind reduce (maybe because, even after the author’s description I still don’t get what it does), but you can’t argue with indexOf and filter. And if those five aren’t enough for you, be sure to check the full list of ES5 functions.

Ok, web components… I guess it’s time that I really dig in, right? And if you’re with me, Google is with us, offering a new Polymer / web components podcast series to help us all get going.

I’ve stated before that, no matter how basic the topic of an article, I will usually at least skim it, knowing that often I will find some nugget that I did not know before. As was the case with ‘s article on JS Comments. I mean, // single-line comment, /* multi-line comment */, done, right? Yes, but, I never knew why /*@cc_on @*/ was in the HTML5 Boilerplate opening html block and I also did not know that you can preserve some comments in most JS minifiers by using @preserve or @license. So there. ;-)

The Internet Explorer team is looking for feature requests from the web developer and designer community.

Yes, that Internet Explorer team, from that Microsoft company…

Having never been that big of a fan of parallax sites, okay, the coding is impressive, and I have seen some nifty “parlor-tricks”, but I’ve never really thought (most of) them all that practical. But sticking solely with fun, and impressive coding, parallax.js, throwing in gyroscope events (mimicked by mouse events on non-touch devices), is all that and more!

Standard HTML page transitions have always seems a bit abrupt to me, but the short-lived practice of using meta transitions is thankfully passé. But I think a sprinkle of Animsition could really make for an elegant-looking effect…

A basic intro to how to start planning for a RWD project. It can be a bit to wrap your head around if you’ve not done one before…

Going back to Addy again:

CSS Layout Debugger: A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page [with] a random (valid) CSS hex color.

Could be useful. He also links to pesticide.io, which uses a set color per tag type. Either could be useful for remote debugging.

At first this sounds great:

RWDPerf: Performance testing for Responsive web design websites

Then you read that the tests are based on emulation (what else could it do, I suppose). Still worth a look, I’d say.

`nother repo for you, `cause, you know, why not…

GifShot: JavaScript library that can create animated GIFs from media streams, videos, or images

And finally, who wants to go ride a roller coaster?

Happy reading,
Atg

Leave a Reply

Your email address will not be published. Required fields are marked *