JavaScript Tutorials

• By Kyle SimpsonSeptember 9, 2014

  Combining JavaScript Arrays

  This is a quickie simple post on JavaScript techniques. We're going to cover different methods for combining/merging two JS arrays, and the pros/cons of each approach. Let's start with the scenario: The simple concatenation of a and b would, obviously, be: concat(..) The most common approach is: As you can see...

• By David WalshSeptember 4, 2014

  Wrapping Text Nodes and Elements with JavaScript

  When you work on a site that relies on a given JavaScript toolkit, you unintentionally end up trying to solve problems within the bounds of the toolkit and not the language.  Such was the case when I tried wrapping text (possibly including HTML elements) with a DIV...

• 

  
• By David WalshSeptember 4, 2014

  Add Rules to Stylesheets with JavaScript

  Since we're using so much JavaScript in our web applications these days, we're looking for more ways to keep them fast.  We use event delegation to keep event listening efficient, we use function debouncing to limit the number a times a given method can...

• By David WalshSeptember 1, 2014

  Retrieving requestAnimationFrame with JavaScript

  The requestAnimationFrame function has been a major boost to developers creating and managing animations with JavaScript.  Paul Irish has an excellent introduction on requestAnimationFrame -- I highly recommend you read it.  This HTML5Hub post is also very good.  Most browsers now support the animation function but in...

• By David WalshAugust 27, 2014

  JavaScript Redirects and window.open

  One of the sweet parts in the simplified HTML5 spec was allowing A elements to wrap DIVs and other block level elements.  For too long we added JavaScript listeners and window.location redirects when a wrapping A would have probably sufficed.  But there are also times when the wrapping A wouldn't work...

• 

  
• By David WalshAugust 19, 2014

  JavaScript insertAdjacentHTML and beforeend

  In case you didn't know:  the damn DOM is slow.  As we make our websites more dynamic and AJAX-based, we need to find ways of manipulating the DOM with as little impact on performance as possible.  A while back I mentioned DocumentFragments, a clever way...

• By David WalshAugust 17, 2014

  Detect if a Function is Native Code with JavaScript

  Every once a while I'll test is a given function is native code -- it's an important part of feature testing whether a function was provided by the browser or via a third party shim which acts like the native feature.  The best way to detect this, of...

• By Kyle SimpsonAugust 12, 2014

  Getting Concurrent With ES6 Generators

  If you've read and digested part 1, part 2, and part 3 of this blog post series, you're probably feeling pretty confident with ES6 generators at this point. Hopefully you're inspired to really push the envelope and see what you can do with...

• 
• By Nick JanssenAugust 11, 2014

  Building Web Apps Faster Using Angus

  When it comes to building web apps, there are a couple of tools available that help you develop faster. There's GruntJS, GulpJS, Brunch and others which streamline your workflow by doing a series of build tasks: Test the code Clean the build directory Copy source files...

• By Kyle SimpsonAugust 3, 2014

  Going Async With ES6 Generators

  Now that you've seen ES6 generators and are more comfortable with them, it's time to really put them to use for improving our real-world code. The main strength of generators is that they provide a single-threaded, synchronous-looking code style, while allowing you to hide the...