GeorgieP

This is a list of web pages with short notes or descriptions used while preparing the submission for Udacity Front End Developer Nanodegree, Project 4.

• AirBnB JavaScript Style guide
  Has nice code examples explaining each style choice, seems to be very popular.
• Google Developers: Make the Web faster
  I referred to these continuously while optimizing page delivery.
  • The PageSpeed Analyzer (where you paste the URL)
  • The PageSpeed Documentation
  • (About) The PageSpeed Insights browser extension, with link to download.
• Talk given by Ilya on optimizing the CRP (YouTube 44:43).
  Soooo much easier to watch than the horrible stiff videos at Udacity. Added to watch later list.
• Google I/O 2013 - Instant Mobile Websites: Techniques and Best Practices
  YouTube, 37:24, Bryan McQuade, Doantam Phan, Mona Vajolahi, added to watch later list.
• PSI: Inline critical CSS
  A discussion on inlining critical CSS in the head.
• PSI: Minify CSS
  A discussion on minifying CSS.
• Devtools, Timeline: timeline event reference
  A deeper dive and explanation of the timeline events, the whole document is very detailed about the timeline.
• Flushing the document early - Steve Sounders
  Interesting discussion on early flushing, bookmarked.
• Flip your animation - Aerotwist
  I've come to this site from a couple of different locations now, but have not read it yet, I see it is the same guy from the second Udacity performance course, and he seems very likable. Will probably revisit during that course, but bookmarking here too.
• BEM naming style
  Everybody's recommending it, even though they admit to not liking it -- a sure sign that it is very good. Must learn / put into practice.
• Coding Math: E14 - Collision Detection
  More in-depth video about CD, Subscribed to Channel on YouTube, looks good.
• CSS Triggers
  Essential reference about what CSS triggers what browser work. Also by the FLIP guy in Course 2.
• Fast DOM
  Eliminates layout thrashing by batching DOM read/write operations, looks interesting, bookmarked.
• HTML5 Boilerplate
  Includes all the server configs one might need, amongst loads of other HTML5 stuff that I'm only barely familiar with right now.
• Web font inlining
  Very, very, very useful comment from MarkN at Udacity about how to include web-fonts in CSS with the Webfont API.
• Gulp and gulp stuff
  
  • . It all started with this post by rosario on the Udacity forums.
  • Getting started, by Andy Carter. I Started here, nice intro.
  • Gulp intro at Sitepoint. Probably the most comprehensive and accurate.
  • Gulp intro by Mark Goodyear. Pretty comprehensive, I used bits from this one too.
  • LiveReload. Gotta look into this in the future.
  • Node Package Manager. Where to find all the Node packages, and gulp packages...
• Web Starter Kit
• Layout Thrashing
  • Fastersite: how not to trigger layout
    a list of layout triggering properties and methods.
  • Web fundamentals, Paul Lewis, Debounce your input handlers.
  • HTML5rocks: Leaner, Meaner Animations with requestAnimation Frame (and more about debouncing on scroll)
    This didn't work for me. I spend hours trying to understand and implementing it but when I got it, I found that it was no improvement, the demo shows no improvement either, and an analysis shows loads of Layout Thrashing going on. The page seems abandoned, comments shoe same observations but are ignored.
• Web Workers
  • MDN docs on web workers
    (gets a bit complicated!)
  • HTML5rocks intro to web workers
    Nice intro by Matt Gaunt from 2014
  • HTML5rocks intro to service workers
  • HTML5rocks into to promises
• MDN element.classList
  Useful docs for toggling classes in elements.
• MDN backface-visibility
• MDN scrollTop
• MDN Dynamic Styling
  How to set CSS rules with JavaScript (article, nice).