Permalink

6

Jank Busting With Daft Punk

Read Later submit to reddit

Yesterday, I looked at the new Daft Punk web experience on Pitchfork. It was visually stunning, featuring rich-animations throughout. I noticed however that scrolling on the page felt quite janky. It was sluggish and stuttered regularly. You could reproduce this by scrolling up and down through the page, something that I struggled with.

Paint profiling it with the DevTools, I noticed lots of issues with layout (peaking ~ 514ms), heavy paint (peak ~178ms) Continue Reading →

Permalink

4

Author In ES6, Transpile To ES5 As A Build-step: A Workflow For Grunt

Read Later submit to reddit

Preface: This article assumes prior knowledge of Grunt, the JavaScript task runner and that you've heard of Traceur, the ES.next to ES5 transpiler by Google. Getting started guides are available for both projects. For information on the current state of ES6, read the current working draft spec.

Today I used a Grunt task called grunt-traceur by Aaron Frost to author code in ES6 (maximally minimal classes, modules, rest params, spread operators) and transpile back to ES5 as a build-step. It felt fantastic and the final product now Continue Reading →

Permalink

12

Taming The Unicorn: Easing JavaScript Memory Profiling In Chrome DevTools

Read Later submit to reddit

“The Unicorn has a special ability to help it's master when in trouble. When tamed, they will not attack humans or tamed creatures, but will attack anything else with negative karma"

The DevTools Heap Profiler and Timeline Memory view can be used to diagnose memory leaks on both desktop and mobile (via remote debugging). When you first use them however, they can feel like a little like a black box, requiring some trial and error to correctly master.

In this article, I’ll walk you through how to tame these tools with answers to some common FAQs to help save you time when memory profiling your apps.

Continue Reading →

Permalink

26

Yeoman Update: announcing 1.0 beta 4, Windows support, Refreshed Angular, Backbone, Ember generators and more.

Read Later submit to reddit

Today we're happy to announce the release of Yeoman 1.0 beta 4. A number of large updates have been made to the project since beta 3, covering scaffolding, performance improvements and overall stability.

The community around the project has also been growing, tackling ideas such as Rails, PHP and Express middleware as well as new generators. In this post, I'll summarize the major updates made to the project as well as exciting work done by the community.

Continue Reading →

Permalink

22

DevTools Extensions For Web App Developers

Read Later submit to reddit

The past year has seen many leaps made to improve developer productivity through better tooling. We're paying increasing attention to our workflow and many of us have spent time optimising our usage of tools like Grunt, Bower, Yeoman and the terminal.

Another important area worth spending time on is your debugging workflow – if you're like me, this starts with the Chrome DevTools. When building an application with a specific framework or language abstraction, there's actually some additional tooling available to you in the form of recent DevTools extensions.

In this post, I'll share a quick summary of the latest developments in this area, ranging from Continue Reading →