Take Back Control
Using modular JavaScript for front-end development
Node Summit, 2018-07-25
Who is this guy?
Laurie Voss
COO & co-founder, npm Inc.
@seldo

What are we talking about?
Part 1:
Avoid Nasty Surprises
Taking Back Control
Part 2:
Take Control of JavaScript Itself
Taking Back Control
JavaScript is enormously popular

Top 5 languages on GitHub
by number of pull requests opened
npm is also popular

Modular code is getting more popular
97% of the code in a modern web app comes from npm
85% of npm users do front-end development
npm is a company that sells goods and services
Your team will ship faster and your code will be more secure with npm Enterprise
Part 1:
Avoid Nasty Surprises
npm is at version 6
Upgrade right now!
npm install npm -g
1. npm locks by default
2. npm saves by default
3. npm ci will double the speed of your builds
npm ci
You can use
anywhere you used to use
npm install
and it will be twice as fast
4. npm has 2FA:
two-factor auth
Secure your npm account in 30 seconds:
npm Security
A bunch of new features
5. npm Quick Audits
Just run npm install!
npm Quick Audit stats
- 3.5 million scans per week
- 51% vulnerable
- 37% high
- 11% critical
Yikes!
6. npm audit
Just run in your current project:
npm audit
Learn more:
7. npm audit fix
Just run in your current project:
npm audit fix
or
npm audit fix --force
for the adventurous
8. npm.community
Part 2:
Take Control of JavaScript Itself
Modular code is great
Modular code is the solution to the problem of tiny human brains

Links in a network increase quickly
links = n(n-1)/2

Human brains cannot handle giant programs
Modular code limits possible interactions

Modular code fits into your tiny human brain
Efficient developers
>>>
efficient code
2008: no modules in JavaScript
2009: all the modules in JavaScript
CommonJS modules
exports = function() {
...
}
var mod = require('filename')
Define:
Use:
2009: An explosion of server-side JavaScript
- Node.js
- SpiderApe
- V8cgi
- K7
- Narwhal
- Jack
2009: all the package managers
JavaScript in 2009 was a mess
People just
tried stuff out
Server side modules today: pretty good
The commit where npm was bundled with node:
Programming language choice is determined by the libraries available
Node.js and npm:
a virtuous cycle
Developers
love libraries

Developers
will do a lot of work
to avoid doing work
Enter transpiling and bundling
2011: browserify
Webpack and babel

Webpack is taking over the web
Babel is changing JavaScript
60% of npm users are building React apps
Webpack + babel works great
So obviously we need to change everything.
Webpack + babel
are kind of a pain
Why are you like this, JavaScript?
Bundling and transpiling is tricky to get right
Bundling is a performance issue
Code splitting is hard
Static analysis is really hard
breaks static analysis
require()
ES6 to the rescue with
import()
ES6 modules
export function square(x) {
return x * x;
}
import {square} from 'filename'
Define:
Use:
But code splitting is still really hard
Browser support for ES6 modules sucks
<script type="module"></script>
No support for module ID
import './lib'
vs
import 'lib'
Module IDs are easy in Node.js
Module ID is essential to reusable code
Without module ID you still need a transpiler
Punting on Module ID is a huge problem
Browser imports have performance issues
HTTP 2 is not going to magically fix everything
ES6 syntax is available already
Old vs. new
Webpack + Babel | ES Modules | |
---|---|---|
ES6 syntax | Yes | Yes |
Static analysis | Yes | Yes |
Code splitting | Hard | Hard |
Transpilation | Required | Required* |
Bundling | Required | Recommended |
* for real-world applications
ES6 modules:
we're just not
that into them
What world do we want?
A proposal:
- Modular JavaScript
- That works on browsers and servers
- Doesn't require transpilation
- Doesn't require bundling
- Can be lazily loaded by browsers
- Doesn't require tons of tooling
- Compatible with npm
npm compatibility is a hard requirement
Because developers are addicted to libraries
npm will evolve
How do we build this?
You already know how.
It's time to step up
by writing some really terrible software
It's 2008 again
We have
fixed this before
Standards bodies don't innovate
Remember XHTML 2.0?
Don't be afraid to try something weird
It's only a website.
This is your time to invent the next big thing
You can be the next random person
Thank you!

@seldo
These slides
Talk to me
Take Back Control
By seldo
Take Back Control
- 4,414