Medium Equals Message

A Quick Introduction to Web Workers

Mon, 17 Jun 2013 19:30:30 +0200

A quick Introduction to Web Workers by Brian Cooksey.

HTML Linting with HTML Inspector

Sat, 15 Jun 2013 20:41:09 +0200

HTML Inspector is a code quality tool to help you and your team write better markup. It’s written in JavaScript and runs in the browser, so testing your HTML has never been easier. Like JSHint and CSSLint, HTML Inspector is completely customizable, so you can use what you like and ignore what you don’t. It’s also extensible and pluggable, making it possible to write your own rules that enforce your chosen conventions.
— Philip Walton

Check out the introductory blog post: Introducing HTML Inspector

The growing responsibilities of a front-end engineer.

Fri, 14 Jun 2013 19:14:30 +0200

A front-end operations engineer would own external performance. They would be critical of new HTTP requests, and they would constantly be measuring file size and page-load time. They wouldn’t necessarily always worry about the number of times that a loop can run in a second — that’s still an application engineer’s job. They own everything past the functionality. They are the bridge between an application’s intent and an application’s reality.

A front-end operations engineer would be very friendly with the quality assurance team, and they would make sure that “performance” is a test that comes up green. They’d monitor client-side errors and get alerts when things go wrong. They’d make sure that migrations to new versions of the application go smoothly, and they’d keep all external and internal dependencies up to date, secure and stable. They are the gatekeepers of the application.
— Alex Sexton

A great article by Alex Sexton obout the shifting role and responsibilities of a front-end engineer.

Read Front-End Ops

Secrets of Browser Developer Tools

Thu, 13 Jun 2013 20:13:40 +0200

A site for discovering all kinds of hints and tips related to developer tools in the browser or in their words for getting the most of your developer tools in Chrome, Firebug, Firefox, Internet Explorer, Opera and Safari. Worth bookmarking.

Check out Secrets of Browser Developer Tools.

2 Useful Tools for Tracing and Debugging JavaScript

Wed, 12 Jun 2013 19:30:39 +0200

TraceGl
Wondering what your code looks like when you can see everything? traceGL records all codeflow so you can wander around and see all logic move.

TraceGl costs $14.99. It is worth every penny and the developer is very responsive, quickly answering questions and fixing bugs.

captureCalls
captureCalls lets you generate a stack trace for any function with one line of code: captureCalls(myFunction); or captureCalls(anObject, ‘aFunction’);

Check out the demo or the repo of this very useful tool.

Your programming language shapes your mental paradigm.

Mon, 10 Jun 2013 19:30:40 +0200

There’s a thought in neuroscience/psychological circles that words are much more than sounds that represent things: they are the abstraction of our higher brain function. Words are language, code is language. Restricting yourself to one or two languages is limiting your cognitive abilities

— Rob Conery

Just like our mental paradigms are shaped by the language we speak, our mental paradigms solving problems with code are limited by the programming languages we know.

Read Knowing More Programming Languages Will Make You Smarter

Weekend Reading: Improve your JavaScript.

Sun, 09 Jun 2013 19:30:37 +0200

A number of articles appeared this week focusing on seeing opportunities to improve the quality of the JavaScript we write.

In Using Duck Typing to Avoid Conditionals in JavaScript, Joshua Clanton explores one way of reducing ‘if-else’ statements which reduces code complexity and improves maintainability. David Walsh discusses avoiding repeated work to improve JavaScript performance. Jack Franklin shares a walk-through of refactoring DOM heavy JavaScript. Meanwhile, Elijah Manor has 6 examples of hard to test JavaScript along with ways to improve their testability.

Deep dive into the murky waters of script loading

Sat, 08 Jun 2013 20:02:00 +0200

In this article I’m going to teach you how to load some JavaScript in the browser and execute it. No, wait, come back! I know it sounds mundane and simple, but remember, this is happening in the browser where the theoretically simple becomes a legacy-driven quirk-hole.
— Jake Archibald

What’s the right answer? async? defer? dynamically writing scripts into the head? In this article, Jake Archibald dives into the spec and explores the options available for loading JavaScript into a webpage.

Check out: Deep dive into the murky waters of script loading

The race for speed part 1: The JavaScript engine family tree

Fri, 07 Jun 2013 23:17:06 +0200

These days we take it for granted that JavaScript execution in modern browsers is fast. The pages of creativejs.com are full of inspiring examples of what that speed can deliver; but it wasn’t always so…

— John Dalziel

John Dalziel has written an accessible and useful 4 part series explaining the history and performance of JavaScript engines and the way they process JavaScript.

Taking JavaScript Seriously with Backbone.js

Thu, 06 Jun 2013 19:30:21 +0200

Solid presentation from Jeremy Ashkenas arguing that it’s time to take JavaScript seriously. In his presentation he dives into Backbone, design decisions that shaped it and how the pieces fit together.

If you are already an avid Backbone user, hearing more about the design decisions might be interesting to you. If you haven’t really explored Backbone.js, this is a solid introduction to the concepts, and an exploration of the problems Backbone.js set out to deal with.

Watch Taking JavaScript Seriously with Backbone.js

All Magic Comes With a Price

Thu, 06 Jun 2013 18:01:04 +0200

Leaning on abstractions is powerful but you should know what it means

— George Ornbo

George argues that the Node.js community should keep things ‘small, understandable and distinct’ in the interest of maintaining the need to understand what’s happening beneath our programming abstractions. Perhaps this is part of the solution but I think the real take away here is that to be a truly excellent programmer, we have a responsibility to take time to understand the abstractions we work with.

All Magic Comes With a Price

The politics of best-practices and maintainability in JavaScript

Wed, 05 Jun 2013 20:22:00 +0200

Recommendations are simply ideas presented for consideration. Many times, the ideas flow from a problem that the recommender experienced at some point in time. Figure out the problem and you can figure out whether or not the context applies to you. That’s the most effective way to learn.

— Nicholas C. Zakas

Nicholas C. Zakas has written an eloquent response to Cargo-culting in JavaScript. In it he attempts to reframe the ‘anti-convention’ conversation, nudging it in a more productive direction.

Read: On the politics, cargo-culting, and maintainability of JavaScript

Getting Started With Node.js and Express.js

Tue, 04 Jun 2013 20:15:30 +0200

Perhaps you already know this: Express.js and Node.js can be a powerful medium for rapid-prototyping. However, if you’ve never used either one, it may seem daunting to get started. Over the past week, I’ve stumbled across a number of useful articles related to using Express.js — ‘a minimal and flexible Node.js application framework’ that help take any edge off the learning curve. In the hopes that it’s useful, I thought I’d share the list in one place.

A collection of articles exploring getting started Express.js and using it to design in the browser.

Read: Express.js and Node.js as a prototyping medium

Where have JavaScript best-practices come from? Cargo-culting in JavaScript.

Sat, 01 Jun 2013 18:01:00 +0200

Cargo-cult programming is what a programmer does when he or she doesn’t know a particular language or paradigm well enough, and so ends up writing redundant and possibly harmful code. It rears its head quite often in the land of JavaScript.

— James Padolsey

Cargo-culting in JavaScript explains where some of the ‘best-practices’ in JavaScript have come from and why you might or might not want to use them. While I don’t agree with everything that James says in this article, the core message is: don’t just blindly apply dogmatic principles without understanding where they come from and why they are important. Think. Gain deep knowledge of your craft and be a critical practitioner.

Read Cargo-Culting in JavaScript.

How to Create Fluent Interfaces in JavaScript

Fri, 31 May 2013 18:01:04 +0200

Fluent interfaces (think chaining in jQuery) seem magical until you understand how they work. Creating chainable interfaces in JavaScript by Joshua Clanton takes a quick look at the simplicity of implementing a chainable interface.

Tool for Visualizing CSS Selectors

Thu, 30 May 2013 18:01:00 +0200

wtcss is a tool for visualizing how css rules are applied to a webpage.

I was working with a large css codebase and wanted to see if our rules were becoming more specific as the css source grew, so I built css.benjaminbenben.com to look at how css rules are applied to a page.
Enter a url to see how the css rules interact with that page
— Ben Foxall

Read the explanatory blog post.

Check out the tool: wtcss

Declarative event binding and dependency injection

Tue, 28 May 2013 18:01:07 +0200

I ran across two interesting projects on Github this week.

trigger allows you to register events in a declarative fashion. From the readme:

Events like ‘click’ and ‘keyup’ are meaningless to the models and logic of most applications, but i bet you still register listeners for them in your application’s code. This is lame… Your application code only needs to know what a particular event means (e.g. ‘save’, ‘delete’, ‘next’, etc). Your app’s ideal javascript would only register listeners for events that are meaningful to your specific application (i.e. custom events).

knit is a library for dependency injection.

Working towards an extensible web

Mon, 27 May 2013 18:01:00 +0200

The sad truth is that while some areas of the browser are extremely extensible, other areas are nearly impossible to extend… If we want to move the web forward, we must increase our ability as web developers to extend it with new features. For years, we’ve grabbed the browsers extension points with two hands, not waiting for the browser vendors to gift us with new features.

— Yehuda Katz

Yehuda Katz writes about making progress towards a more extensible web and invites implementers and practitioners to help make it happen.

Extend the Web Forward

Removing anonymous event listeners

Sun, 26 May 2013 18:01:11 +0200

I recently ran into a problem involving the removeEventListener() method, which caused me a good half an hour of confusion before a lightbulb appeared above my head and I was enlightened by a solution — a solution which, it must be said, is very obvious in hindsight. So doubtless many people know this already, but I’m recording it here along with another approach I thought of afterwards, in the hope that they may be useful to someone in the future.

— Peter Gasston

Peter Gasston, author of “The Modern Web” shares a solution to Removing anonymous event listeners

Tips for successfully teaching developers

Sat, 25 May 2013 18:01:26 +0200

There is a massive need for great explanations on all kinds of topics. Without good explanations, many open source projects will fail. It’s pretty simple: if people don’t know to use your software, they won’t.

— Geoffrey Grosenbach

Explaining difficult concepts well is hard. Over at Peep Code there’s a good article this week on the art of teaching developers. Useful concepts to remember whether you’re writing tutorials or a blog, giving a presentation or imparting knowledge in the midst of the day.

Read Teaching Developers.