Tweet
Tweet

Slide 1

Slide 1 text

& YUI FUTURE THE Eric Ferraiuolo @ericf

Slide 2

Slide 2 text

WHAT IS YUI? FEEL FREE TO SHOUT!

Slide 3

Slide 3 text

DESIGN PRINCIPLES

Slide 4

Slide 4 text

YUI Infrastructure Extensibility Abstraction Use-case driven Sandboxing Consistency Runs everywhere Code organization Code loading Documented Good citizen Facades Composition Adaptation Works for everyone

Slide 5

Slide 5 text

WEB PLATFORM THE

Slide 6

Slide 6 text

PAST Desktop JavaScript (ES3) HTML & CSS

Slide 7

Slide 7 text

CURRENT Desktop HTML & CSS Mobile JavaScript (ES5) JavaScript (ES3) HTML & CSS HTML5 & CSS3

Slide 8

Slide 8 text

FUTURE Desktop Mobile JavaScript (ES5) JavaScript (ES3) HTML & CSS HTML5 & CSS3 JavaScript (ES6) Web Components

Slide 9

Slide 9 text

FUTURE JavaScript (ES6)

Slide 10

Slide 10 text

ECMASCRIPT 6 Promises computed properties => Modules Iterators Sets Maps Generators Destructuring class const let Proxies default function params rest / spread for-of loops comprehensions Template Strings block scoping Object.assign Object.mixin Object.is Array.from Array.of Array.prototype.find Array.prototype.findIndex Number.* Math.* String.fromCodePoint Object.getPropertyNames

Slide 11

Slide 11 text

ECMASCRIPT 6 Promises computed properties => Modules Iterators Sets Maps Generators Destructuring class const let Proxies default function params rest / spread for-of loops comprehensions Template Strings block scoping Object.assign Object.mixin Object.is Array.from Array.of Array.prototype.find Array.prototype.findIndex Number.* Math.* String.fromCodePoint Object.getPropertyNames

Slide 12

Slide 12 text

FUTURE JavaScript (ES6)

Slide 13

Slide 13 text

FUTURE JavaScript (ES6) Web Components

Slide 14

Slide 14 text

WEB COMPONENTS Templates Decorators Custom Elements Shadow DOM Imports

Slide 15

Slide 15 text

FUTURE JavaScript (ES6) Web Components

Slide 16

Slide 16 text

FUTURE JavaScript (ES6) Web Components Desktop Mobile

Slide 17

Slide 17 text

EVERGREEN BROWSERS

Slide 18

Slide 18 text

FUTURE JavaScript (ES6) Web Components Desktop (Evergreen) Mobile (Evergreen)

Slide 19

Slide 19 text

WEB PLATFORM THE

Slide 20

Slide 20 text

WEB PLATFORM THE +YUI

Slide 21

Slide 21 text

YUI

Slide 22

Slide 22 text

YUI Infrastructure Extensibility Abstraction Use-case driven Sandboxing Consistency Runs everywhere Code organization Code loading Documented Good citizen Facades Composition Adaptation Works for everyone

Slide 23

Slide 23 text

YUI Infrastructure Extensibility Abstraction Use-case driven Sandboxing Consistency Runs everywhere Code organization Code loading Documented Good citizen Facades Composition Adaptation Works for everyone

Slide 24

Slide 24 text

FACADES VS. POLYFILLS

Slide 25

Slide 25 text

INTEROPERABILITY

Slide 26

Slide 26 text

YUI & ES6 MODULES

Slide 27

Slide 27 text

TRANSPILE ES6 MODULES Node.js YUI AMD

Slide 28

Slide 28 text

EXPORT VS. NAMESPACE

Slide 29

Slide 29 text

BACKWARDS COMPATIBLE

Slide 30

Slide 30 text

ES MODULE SYSTEM LET’S DO THIS!

Slide 31

Slide 31 text

WALLED GARDENS KNOCK ‘EM DOWN!

Slide 32

Slide 32 text

CLIENT + SERVER SYSTEMS

Slide 33

Slide 33 text

YUI & PURE + MODOWN

Slide 34

Slide 34 text

FUTURE THE