programming

Avoiding Front-End SPOF in Single Page Apps

3 minute read Published

Effective mitigation of common single points of failure in web applications.
This post originally appeared on the Trunk Club Tech Blog. Some links have been updated to point to their new canonical resource locations.

A couple years back Steve Souders gave a great talk at Fluent Conf titled Your Script Just Killed My Site (video). During the talk Steve explained front-end SPOF and pointed towards a nice tool for detecting it. Fast-forward a couple of years and front-end SPOF is still a concern in web development. And, when building a single-page app, SPOF is an even bigger deal as it can cause an entire web app to become unresponsive, putting users at the mercy of the browser to download and execute 3rd-party scripts prior to bootstrapping. Read on to learn how to avoid front-end SPOF using Trunk Club’s single-page app skeleton, Brunch with Panache (BWP).

Learn how to avoid front-end SPOF using Trunk Club’s single-page app skeleton, Brunch with Panache

Chaplin Collection Views Using Css Transitions

2 minute read Published

How to use the Chaplin library to animate routing transitions.
This post originally appeared on the Trunk Club Tech Blog. Some links have been updated to point to their new canonical resource locations.

My team at work is currently porting an e-commerce SPA from an older framework over to Brunch with Panache (BWP), our open source development framework for web clients. Like the old framework, BWP uses both Backbone and CoffeeScript. But to make composing applications easier BWP kicks it up a notch and adds in Chaplin, giving us Collection Views.

One of the downsides with the out-of-the-box Collection Views provided with Chaplin is that they use JavaScript-based animation to fade-in the item views once the collection has been fetched. And while this may be OK for many applications, it’s not ideal for apps with pages which have many collection views, or for mobile user agents in general.

Using Promises for Non-AJAX Asynchronous Callbacks in JavaScript

1 minute read Published

Using promises to avoid callback race conditions in JavaScript.

After recently falling prey (again) to the immediate execution of a counter-based timing function used to execute a non-Ajax asynchronous callback method in JS, I wanted to share this very useful article I stumbled upon while looking for an approach that would meet my needs.

Amp Up CoffeeScript Coding with Sublime Text

3 minute read Published

How to add syntax highlighting for CoffeeScript to the Sublime Text editor.

Sublime Text with CoffeeScript is a JavaScript developer’s dream, but one that doesn’t evaporate in the fog of sleep shortly after waking. After learning about Sublime Text at Fluent Conf 2012 during a plenary talk from Paul Irish, I immediately began looking for ways to incorporate it into my workflow. And now, after having used it for over 8 months in my day-to-day work, I wanted to share a quick primer for those who want to amp up CoffeeScript coding with Sublime Text too.

Get Started with PHP in Eclipse IDE

2 minute read Published

How to configure Eclipse for PHP development.

Eclipse is a powerful IDE supporting many different languages, including PHP. Unfortunately, many Eclipse installations do not provide PHP language support right out of the box—some assembly required. This article will focus on getting Eclipse set-up for PHP development and local debugging.

Switching from Firebug to Chrome Dev Tools

1 minute read Published

Video from Paul Irish on developer accordances in Chrome Dev tools.

Here’s the presentation given at Google I/O this year by Paul Irish and Pavel Feldman that got me to switch to Chrome Developer Tools promptly after watching. If you’re a front-end web developer and haven’t seen this yet take a look. It just may change the way you work.

Optimize Mobile Performance with Jdrop

2 minute read Published

How to use Jdrop to debug mobile browsers without a dev tools IDE.

Last month Steve Souders announced Jdrop, a JSON repository in the cloud. Using Jdrop and Souders’ Mobile Perf bookmarklet, developers can send mobile browser data to the cloud for more careful analysis on other devices.