Welcome
to the new

Nodevember, 2017-11-27
Who is this guy?
Laurie Voss
COO & co-founder, npm Inc.
@seldo

I'd like a show
of hands
What are we
talking about?
Part 1: What's new
Part 2: What's next
The Ship of Theseus
aka Your Grandfather's Axe
Plutarch, 75 ACE
(If ancient Greeks had computers, would they have had a year 100 bug?)
npm is
the ship of Theseus
What is npm?
- Client
- Registry
- Website
- Company
- Workflow
- Community
1. npm is a client
2. npm is a registry

3. npm is a website
4. npm is a company
- We sell goods and services
- That make you more productive
- You may wish to buy them
- Just a thought.
5. npm is a workflow
6. npm is a community
There are 11 million users of npm
50% of npm's users have been using it for less than a year.
83% of npm users write mostly front end code

You are
a real npm user.
You are part of
the npm community.
npm's goal:
Reduce friction
for JavaScript developers
npm just wants to get out of your way
Part 1:
What's new
in npm today
The client
npm install npm -g
Get npm 5 right now:
npm 5 is 10x faster

npm init
If you aren't using it already, you should.
npm 5 locks
by default
package-lock.json produces perfectly reproducible builds, every time.
When to use package-lock.json
Semantic Versioning
SemVer basics
2.15.58
Breaking
Feature
Fix
major
minor
patch
How npm
uses SemVer
dependencies: {
"abbrev": "1.1.1",
"lodash": "~1.4.1",
"mysql": "^2.3.5",
"qs": "*"
}
SemVer increases efficiency by reducing communication
SemVer reduces code duplication
SemVer is great for building software
Not so great for shipping software
Lock files are better for shipping software
package-lock.json
is for apps
package.json is for libraries
Shrinkwrap is for never.
Do not use shrinkwrap.
npm 5 saves
by default
No more need for npm install --save
npm 5
works offline
You can force npm to use only the cache
npm install --offline
npm install --prefer-offline
package.community
The registry
The registry is faster
- Requests are served 40% faster
- Metadata responses are 50% smaller
- Downloads are up to 200% faster
- Not counting the new faster client!
🔒 2FA 🔒
Webhooks
Learn more:
Scopes
npm install @yourname/yourpkg
@yourname/yourpkg
var yourpkg = require('@yourname/yourpkg')
Install:
Use:
npm Organizations are free
unpublish
is restricted
Use
npm deprecate instead
The new npm website:
- username: GCU
- password: Please Clap

Search is better
Search was a gift from the community!
npm, Inc.
Most commonly asked question:
"How do you folks make money, exactly?"
npm is a company that sells services that make JavaScript developers more productive
You should try them. You'll like them.
npm Enterprise will make your giant corporation feel good about JavaScript
The npm workflow
Run scripts
Lifecycle hooks

publish: prepublish, publish, postpublish install: preinstall, install, postinstall uninstall: preuninstall, uninstall, postuninstall version: preversion, version, postversion test: pretest, test, posttest stop: prestop, stop, poststop start: prestart, start, poststart restart: prerestart, restart, postrestart
Lifecycle scripts make your team more productive
Because they have to yell at each other less often
✨ npx ✨
npx create-react-app
npx serve
npx for updates
npx npm-check -u

npx runs dev dependencies
Don't install
tools globally
- Install tools as dev dependencies
- Run them with npx
- It's faster and safer
🎉 cipm 🎉
cipm is 2x faster than npm 5
cipm is 20x faster than npm 4
🌟
😮
The npm community
Part 2:
The next challenge
A brief history of modular JavaScript
Modular code
is great
Modular code is a solution to the problem of tiny brains

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

Our brains cannot handle giant programs
Modular code limits possible interactions

Modular code fits into your tiny brain
This is why npm is so popular!
2008:
No JavaScript modules
2009:
All the modular JavaScript
CommonJS modules
exports = function() {
...
}
var mod = require('filename')
Define:
Use:
2009:
An explosion of server side JS
- Node.js
- SpiderApe
- V8cgi
- K7
- Narwhal
- Jack
2009:
All the package managers
- npm
- Kiwi
- Mode
- Sproutcore
JavaScript in 2009 was a mess
Server side modules: pretty good
Front end modules: not so good
Transpiling + bundling
- 2011: Browserify
- 2014: Webpack and Babel
Webpack
is taking over JavaScript
Webpack works great
So naturally, we have to change everything.
Why do we have to change everything?
I was just getting the hang of this!
Bundles have performance problems
Code splitting
Static analysis
require() is not good for browsers
ES6 imports
ES6 module format
export function square(x) {
return x * x;
}
import {square} from 'filename'
Define:
Use:
Code splitting in ES6
Browser support for ES6 modules
<script type="module">
No support for module ID
import './lib' import 'lib'
Module IDs in Node
Module ID is key to modular code
Without module ID, transpilation is still necessary
Punting on
Module ID is
a huge problem
Browser imports have performance problems
HTTP/2 is not going to magically fix everything
ES6 syntax is available already
Old vs. New
Webpack + Babel | ES6 modules | |
---|---|---|
ES6 syntax |
Yes | Yes |
Static analysis | Yes | Yes |
Code splitting | Hard | Hard |
Transpilation | Required | Required |
Bundling | Required | Recommended |
The next question
How to get:
- modular JavaScript
- statically analyzed
- with no bundling step
- and no transpilation?
The answer is you
Time to step up
by writing some terrible software
We are in 2008 again
We fixed this before
Standards bodies will not fix this
Don't be afraid
It's only a website.
This is your time
Help repair
the ship of Thesus
Welcome to
the new npm
One more thing...
Thank you!

@seldo
These slides
Talk to me
Welcome to the new npm (Nodevember)
By Laurie Voss
Welcome to the new npm (Nodevember)
- 5,148