Parallax done “right”

I put “right” in quotes because, well, I’m opposed to gimmicky animations in web pages on principle. However, if you have to use them, they should be done efficiently.

To that end, I found this article on Medium from May 2014 that has a series of tips, at least four of which I’ve put into effect just this morning and one of which I never even knew existed before today.

Trident is dead, long live Spartan

The part I wanted to understand most about the new browser coming in Windows 10 is explained:

“In order to ensure that we also retain backwards compatibility, we will not be getting rid of Trident [the IE rendering engine]. Instead, we designed and implemented a dual-engine approach, where either the new modern [EdgeHTML] rendering engine or Trident can be loaded. This switch happens transparently to the user. Windows 10 will use EdgeHTML for the web (so no more worrying about doc modes) and only load Trident for legacy enterprise sites. “

Broken images? Show a placeholder instead

In my recent employee directory app, I had an interesting problem with personnel photos: not everybody had one. Those who did had them stored in a single directory as “{{employee.id}}.jpg”, so it was easy to add a link to the image using AngularJS. But it wasn’t easy for JavaScript to detect if the image was missing or not.

I pondered several possible solutions, and decided on this one: Instead of inline images, which show a “broken image” icon when the image can’t be found, I’d use a fixed-size div element and a style attribute to add the employee’s photo as a background-image. When the employee photo couldn’t be found, the background image would simply be invisible. Continue reading

What I’ve been up to

Nothing new to add to the portfolio right now, so I’ve been continuing to study up on AngularJS 1.3 and improving my employee directory app, mostly through code optimizations — I’ve still got a lot to learn.

I bought an e-book version of ng-book by Ari Lerner recently, and have been working my way through it. I have an unusual approach to learning a new language or framework, I think — first I learn what it is, then I study the tutorial, then I study the documentation and try to build something, and then (if I still need it) I buy a good book to help me out.

When I was first learning jQuery, that book was O’Reilly’s jQuery Cookbook by Cody Lindey (et.al.) — it didn’t try to teach me jQuery from scratch, but approached it in a “here’s a problem, here’s how to solve it” way that I personally prefer. (It might be worth mentioning that I was never a good classroom learner in school. In my opinion, the best thing about a good instructional book is that you can learn from it at your own pace.)

ng-book doesn’t use the cookbook approach, but it does walk through AngularJS in a much clearer manner than the documentation does. So far, almost every chapter has taught me something new that I’ve implemented in my existing code. If you were to ask me the best way to learn AngularJS from the beginning, I’d suggest the official tutorial followed by ng-book, and use the documentation to fill in the technical gaps as you implement what you learn.