Lazy Loading ES2015 modules in the browser (talk)

I gave this talk on June 17th, 2016 at Front End Design Conference
in St. Petersburgh, FL, on August 2nd, 2016 at DevCon5 in New York, NY, on August 18th, 2016 at Abstractions in Pittsburgh, PA, on September 29th, 2016 at SF Web Performance Meetup in San Francisco, CA, and on December 8th, 2016 at Women Who Code Meetup in San Francisco, CA.

This talk is about loading code during page load time vs lazy loading, then how to load ES2015 modules both synchronously (during page load) and asynchronously (lazy-load) using System.js over Babel, as well as how to use JSPM and Webpack 2 to bundle your app and resolve dependencies.

What will the audience learn

  • The fundamentals on when to load your modules (page load time vs lazy loading) for a most optimized page performance
  • The 3 main module systems in JavaScript: AMD, CommonJS and ES2015 modules
  • The ES2015 Module Loader spec and System.js
  • Importing modules synchronously and asynchronously
  • JSPM as a dependency management system
  • Webpack 2 as a dependency management system

Slide deck

Resources

Sample repos

Design Patterns for JavaScript featuring Modules

I gave this talk on July 21st, 2015 at DevCon5 in New York, NY and on October 27th, 2016 at Women Who Code Meetup in San Francisco, CA.

This talk is about the essential design patterns for JavaScript applications such as Constructor, Façade and Module, focusing on the different module strategies as CommonJS, AMD and ES2015 Modules.

Slide deck

Prerequisites:

  • Intermediate JavaScript
  • Advanced OOP
  • Familiarity with Design Patterns

Resources:

10 tips for writing maintainable code in Backbone.js

I gave this talk on July 20th, 2015 at Dancing with Marionette.js meetup in New York, NY.

This talk explains some pitfalls, solutions and good practices for common scenarios in Backbone.js. In this talk the audience will learn about Marionette.js, React, Epoxy.js and Sinon.JS and how do they solve problems about performance, memory, productivity and code organization.

Video

YouTube video link

Slide deck

Prerequisites:

  • Backbone.js
  • Design patterns for large-scale javascript
  • Curiosity
  • Opinion

Resources:

Backbone.js tricks or treats for HTML5DevConf

I gave this talk on October 20th, 2014 at HTML5DevConf in San Francisco, CA, and also on October 9th, 2014 at Backbone.js Hackers meetup also in San Francisco, CA.

This talk explains some pitfalls, solutions and good practices for common scenarios in Backbone.js. In this talk the audience will learn about Marionette.js, React, Epoxy.js and Sinon.JS and how do they solve problems about performance, memory, productivity and code organization.

Slide deck

Prerequisites:

  • Backbone.js
  • Design patterns for large-scale javascript
  • Curiosity
  • Opinion

Resources:

Backbone.js tricks or treats

On March 20th, 2014 I gave this talk at Avenue Code in Belo Horizonte, MG, Brazil. This talk explains some pitfalls, solutions and good practices for common scenarios in Backbone.js. In this talk the audience will learn about Marionette.js, Epoxy.js and Sinon.JS and how do they solve problems about performance, memory, productivity and code organization.

Slide deck

Prerequisites:

  • Backbone.js
  • Design patterns for large-scale javascript
  • Curiosity

Resources:

Design Patterns for Large-Scale JavaScript

On January 27th, 2014 I gave this talk at Avenue Code in Belo Horizonte, MG, Brazil, about the essential design patterns for large-scale JavaScript applications.

Slide deck

Prerequisites:

  • Intermediate JavaScript
  • Advanced OOP
  • Familiarity with Design Patterns

Resources:

Boosting the client-side with Backbone.js

On January 8th, 2014 I gave this talk at Avenue Code in Belo Horizonte, MG, Brazil, about the fundamentals on client-side apps, REST, JSON, MVC and how to blend it all together in a mature JavaScript SPA library from the MV* family, Backbone.js.

Video

YouTube video link


Slide deck

Prerequisites

  • JavaScript
  • Familiarity with web frameworks such as Struts, JSF, Rails, Spring MVC…

Resources

How to organize your app

Live educative sample

Boosting the client-side with Backbone.js [pt]

On October 19th, 2013 I gave this talk (in Portuguese) at DevDay 2013 in Belo Horizonte, MG, Brazil, about the fundamentals on client-side apps, REST, JSON, MVC and how to blend it all together in a mature JavaScript SPA library from the MV* family, Backbone.js.

Video

YouTube video link


Slide deck

Source code

Prerequisites

  • JavaScript
  • Familiarity with web frameworks such as Struts, JSF, Rails, Spring MVC…

Resources

How to organize your app

Live educative sample

JavaScript for Real

On August 13th and 28th, 2013 I gave this talk at Avenue Code in Belo Horizonte, MG, Brazil, focusing on developers coming from languages such as Java, explaining how to code in JavaScript for real and start the good practices right now.

Part 1

YouTube video link


Part 2

YouTube video link


Prerequisites

  • HTML
  • CSS
  • Familiary with JavaScript

Resources

Learn Javascript