Useful Links and Resources

Rob Cherny edited this page Aug 26, 2015 · 13 revisions
Clone this wiki locally

Useful Front End Engineering Resources

A broad, and (hopefully evolving) set of general information regarding Front End Engineering (F2E) at Roundarch Isobar. We are looking into some ways to better maintain a list such as this in the near future.

Some of this may end up referenced in the next generation version of our coding guidelines (TBD). Please see Standards.Next.

Please contact us for corrections or additions.

Recently Added:

Other Standards Guidelines

Other Resources

HTML5

"HTML5" is a highly misused term. There is the marketing angle and the technical angle. People and organizations say that they want "HTML5" but sometimes have no idea what they mean, or that what they really mean is that they want new features based on:

  • HTML5 Specs
  • HTML5-related Specs
  • CSS3
  • Techniques being made available in modern browsers via new JavaScript API's

Call it the HTML5 family, whatever you want to call it, it's the stuff driving the new wave of browser-based innovation coming from Mozilla, Google, Apple, Opera, and yes, even Microsoft (IE10+ supports HTML5-related technology in some compelling ways).

The JavaScript (JS) angle is incredibly important because as browser's JavaScript engines have gotten faster the browser manufacturers and Front End Engineers have pushed limits and begun to exploit the API's that are available to do some amazing things. Please see the JS section below.

HTML5 Really Defined

This is an older article (2010) but it helps explain a lot of the confusion:

And from (formerly) Isobar's own Rob Larsen:

Features, In General

These are not HTML5 specific features, but they're very frequently tossed into the same buckets.

  • Canvas
  • SVG
  • localStorage
  • File System API
  • Web Sockets API
  • Geolocation
  • Full Screen API
  • WebGL
  • Navigation History (pushState) API
  • Audio, Video, etc.
  • Offline Application Cache
  • Web Workers (threaded JavaScript)
  • Web Fonts / Font Embedding
  • CSS Transitions
  • CSS Transforms

Some HTML5-related Links

Additional links that are resources and learning references:

Browser Support

Choices pertaining to browser support and more modern front end development are sometimes tough based on the target audience. Before a project starts, it will be critical to understand several things:

  • What browser versions and users are critical for the business audience?
  • If users of "older browsers" will be given the full experience, or if a gracefully degraded experience that either reduces the service's functionality, or simply loses some less important design ornamentation (e.g. rounded corners, drop shadows, gradients) is OK.

Links

Progressive Techniques, Polyfils, Libraries, etc.

Staying Current

Build Systems

CSS3 Approaches

JavaScript

Effectively the modern "HTML5" related family of technologies and substantial attention over the last half-dozen years to Ajax has allowed JavaScript development in the "wild" grow up and mature significantly. We are not talking about copy and past scripts any longer. Anyone who just drops scripts inline into the global scope is doing it wrong.

JavaScript Coding Links

Books

More to come. Soon.

Regarding Libraries, Frameworks, Etc.

JS Module Management

JavaScript Unit Testing

More soon. Move on. Nothing to see here (actually there's plenty but ... give us time ... )

Performance Best Practices

Performance Testing Tools

Mobile and Handheld Development

This is a whole other topic with much to say. Suffice to say, if you're doing a major site or application doing any of the above, and you're not thinking about Mobile First, then you're doing it wrong.

More to come. Really. Stay tuned.