The Top 14: The Most Popular HTML5 Hub Articles in 2014

To mark the end of a fantastic HTML5 year, we’ve decided to take a look at HTML5 Hub content that has proven to be the most popular amongst our online fans and readers. This content was contributed by YOU, the HTML5 developer community. Here is a list of the 14 most viewed articles on the HTML5 Hub in 2014.

1) Comparing HTML5 Mobile UI Frameworks

Author: Andrew Hyde Smith

In response to the growing market for mobile apps several HTML5 Mobile UI Frameworks are now available to help developers create attractive and responsive apps. These libraries enable Web developers to create great user experiences for their apps using technology and skills that they are familiar with.

2) Ellipse My Text...

Author: Kyle Simpson

You may be starting to notice a trend from my recent articles here on HTML5 Hub. I’m a JS snob by trade, but by association I have to deal with my fair share of CSS issues. So, as an “outsider” looking in, I’m taking this opportunity to highlight some of the big “pain points” that CSS causes for various basic tasks in web dev.

3) HTML5 <picture> Element

Author: Christopher Schmitt

Responsive design techniques are a way for developers to adapt a site layout to a wide range of devices, from desktops to iPhones, and have it consistently look sharp and load quickly. And no responsive design solution is complete without an adequate technique for dealing with images.

4) Using WebGL to Add 3D Effects to Your Website

Author: Guillaume Lecollinet

You have probably heard about the growing interest in WebGL, the technology that allows for real-time 3D graphics in the browser. For a few years, talented people around the world have been using it to create amazing experiences, music videos, games, data visualizations, and more.

5) Centering All the Directions

Author: Kyle Simpson

Since the dawn of civilization, mankind has struggled and strived, against all odds, to achieve that next level of human evolution; to stake out our place on this great planet, and in the universe around us; to boldly go where… Oh, never mind the hyperbole."

6) AngularJS* Tutorial

Author:Tyler Smith

This tutorial is going to go over how you can bind an HTML5 slider to dynamically update the style of a div in real time. Some best practices will be deferred for ease of learning, so I do suggest taking a look at the doc links I’ll post throughout the tutorial. At the bottom of the page there is a link to the full demo source code for tinkering. So let’s get started. First, we’ll setup the page for Angular by including the JavaScript file.

7) HTML5 Video on Mobile - A Primer

Author: Alicia Liu

Support for HTML5 video has improved over the last few years, but nonetheless, video is one of the HTML5 features that has more fractured browser support, and the inconsistencies are even more apparent on mobile platforms.

8) Using the getUserMedia API with the HTML5 video and Canvas Elements

Author: Ian Devlin

One of the really cool things that has come out of the W3C is a web API that gives you the ability to access a webcam’s video and/or audio through the browser. This is the getUserMedia API. Here we will take a quick look at the API and how we can use it.

9) How to Make a Sidescroller Game with HTML5

Author: Pablo Farias Navarro

In this tutorial, you’ll learn the basics of HTML5 mobile game development using the Phaser library, by creating a simple side-scroller mobile/cross-platform game from scratch.

10) Build a JavaScript* Particle System in 200 Lines

Author: Jarrod Overson

In less than 200 lines of vanilla JavaScript* you will have a flexible particle system with multiple emitters and fields that repel and attract thousands of particles.

11) Request Animation Frame for Better Performance

Author: Jon Raasch

Traditionally, JavaScript* animation can be handled a number of ways. One approach involves using a timing function such as setTimeout or setInterval to adjust styling every couple milliseconds. Another approach creates a loop that changes styling as many times as possible along the animation’s time frame. The logic of both of these approaches is to throw a large number of animation frames at the browser, so that it hopefully renders smooth-looking motion.

12) 'SRCSET' Attribute Solving Responsive Image Dilemma

Author: Christopher Schmitt

Responsive design has become more complex and vital than ever. Not only do you need to accommodate design layouts for mobile devices, but you also need to take into account high pixel density displays, like Apple’s Retina devices.

13), no, ::before... wait...

Author: Kyle Simpson

Is it getting old for this crusty JS developer to keep venturing into the CSS world for these posts? :) Here’s a quick rant. And I think most people can probably agree it was a screw-up to land how we did.

14) Building Cordova* Applications with Crosswalk

Author: Ningxin Hu

Crosswalk is a web application runtime based on Blink and Chromium which supports Android* 4.0+. By integrating Cordova* with Crosswalk, a developer can use remote debugging capabilities, access cutting edge HTML5 features, such as WebGL, WebAudio and WebRTC, and significantly enhance the performance of Cordova* apps on Android* 4.0+ devices.

For more complete information about compiler optimizations, see our Optimization Notice.