Overview
Explore native JavaScript modules in this 41-minute conference talk from WeAreDevelopers World Congress 2018. Dive into the modern browser support for native JS modules and learn how they're changing JavaScript bundling and code execution. Discover the level of support in browsers and Node.js, and uncover key findings and potential pitfalls when publishing and using modules in production. Follow along as the speaker covers topics such as external JS files, Async Module Definition, CommonJS, ECMAScript Modules (ESM), ESM features, differences from classic scripts, module loading order and process, handling circular dependencies, ES module paths, package name maps, dynamic imports, and performance considerations. Gain practical insights through a demo on lazy loading Bootstrap scripts based on user actions, and learn about NPM package entries, import.meta, and unit testing for modules.
Syllabus
Intro
First attempt: external JS files
Async Module Definition
CommonJS
ECMAScript Modules aka JavaScript modules aka ESM
ESM Features
Differences with classic scripts
Modules loading order
Module loading process
Handling circular dependencies
ES module path
Package name maps (module resolution algorithm)
Dynamic import()
DEMO Lary load of Bootstrap scripts on user actions
NPM package entries
import.meta
Other types of scripts
Performance
Unit Testing
Taught by
WeAreDevelopers