js moderno - do coder ao shareholder

JS ModernoDo coder ao shareholder

linkedin.com/in/luizgonzaga

@luizmarelo

Disclaimer★ “There are no silver bullets"

Derpina Derp

Derpina

Líder de Projeto… Arquiteto…Programador…

Derp

CEO…Gerente…Líder de Projeto…

Derpina

Líder de Projeto… Arquiteto…Programador…

Derp

CEO…Gerente…Líder de Projeto…

Derpina

Líder de Projeto… Arquiteto…Programador…

DerpCoder

CEO…Gerente…Líder de Projeto…

Derpina

Líder de Projeto… Arquiteto…Programador…

DerpSha

reholde

r

Coder

Era uma vez…

Era uma vez…★1995:

Brendan Eich @ Netscape: Mocha ➛ Livescript ➛ Javascript

Era uma vez…★1995:

Brendan Eich @ Netscape: Mocha ➛ Livescript ➛ Javascript

★1996:JavaScript clonado no IE 3.0: “JScript”

ES.next / “Harmony”

“ES4” E4X

“ES4”

ECMA International Technical Committee 39 (TC39)

ECMAScript

Espiando o ES 6★Sintaxe + concisa e expressiva

★Modules e Sand-boxing

★Declaração de "Classe"

★ Iterators e generators

★Promessas

★ Interpolação de String

★Objetos e arrays binários

★Hash Maps e Sets "fracos"

★Mais Math e String built-in

★Melhor suporte Unicode

Moral da História★JS foi mesmo criado “na tora”

★Passou e vem passando por um longo processo de aperfeiçoamento (ES x.x)

★Mas, mesmo assim, é uma linguagem cada vez melhor e ubíqua

★E hoje, grandes nomes contribuem para torná-la excelente…

Implementações ES

V8 SpiderMonkey Chakra Webkit

Implementações ES

V8 SpiderMonkey Chakra Webkit

Back && Front

Back && Front★Com um mínimo (ou nenhum) esforço, podemos reutilizar

código entre servidor e cliente

Back && Front★Com um mínimo (ou nenhum) esforço, podemos reutilizar

código entre servidor e cliente

★Bibliotecas compartilhadas (templates, validação, http…)

Back && Front★Com um mínimo (ou nenhum) esforço, podemos reutilizar

código entre servidor e cliente

★Bibliotecas compartilhadas (templates, validação, http…)

★Pré-renderizar um template ou mesmo uma árvore DOM no servidor

Back && Front★Com um mínimo (ou nenhum) esforço, podemos reutilizar

código entre servidor e cliente

★Bibliotecas compartilhadas (templates, validação, http…)

★Pré-renderizar um template ou mesmo uma árvore DOM no servidor

★Navegadores headless (Testes, relatórios, screenshots…)

Back && Front★Com um mínimo (ou nenhum) esforço, podemos reutilizar

código entre servidor e cliente

★Bibliotecas compartilhadas (templates, validação, http…)

★Pré-renderizar um template ou mesmo uma árvore DOM no servidor

★Navegadores headless (Testes, relatórios, screenshots…)

1 [! 2 {! 3 "age": 25,! 4 "_id": "53838b29a868960200000001",! 5 "__v": 0,! 6 "name": {! 7 "first": "John",! 8 "last": "Doe"! 9 }!10 },!11 {!12 "age": 65,!13 "_id": "53838b29a868960200000002",!14 "__v": 0,!15 "name": {!16 "first": "Jane",!17 "last": "Doe"!18 }!19 },!20 {!21 "age": 45,!22 "_id": "53838b29a868960200000003",!23 "__v": 0,!24 "name": {!25 "first": "Alice",!26 "last": "Smith"!27 }!28 }!29 ]!

?

15+ anos★Legado de tecnologias EE

★ “Muitas organizações vem se encontrando de mãos atadas, restringidas e de fato impedidas na sua habilidade de inovar”

Joe McCann - COO @ Node Firm

JS: Reboot

JS: Reboot★Aplicações web || responsive mobile [Backbone, Angular, React,

Dust…]

JS: Reboot★Aplicações web || responsive mobile [Backbone, Angular, React,

Dust…]

★Aplicações mobile [Cordova / PhoneGap, Kirin, Titanium, iOS/OSX#WebViewJavascriptBridge…]

JS: Reboot★Aplicações web || responsive mobile [Backbone, Angular, React,

Dust…]

★Aplicações mobile [Cordova / PhoneGap, Kirin, Titanium, iOS/OSX#WebViewJavascriptBridge…]

★Aplicações desktop [node-webkit, DeskShell, ChromeApps, Prism, Adobe AIR…]

JS: Reboot★Aplicações web || responsive mobile [Backbone, Angular, React,

Dust…]

★Aplicações mobile [Cordova / PhoneGap, Kirin, Titanium, iOS/OSX#WebViewJavascriptBridge…]

★Aplicações desktop [node-webkit, DeskShell, ChromeApps, Prism, Adobe AIR…]

★Projetos em hardware [Espruino, Tessel, Arduino…]

JS! Por quê?

JS! Por quê?★ “Já está lá”

★Baixo risco

★Escreva código e aplicações uma vez

★Conjunto macro de conhecimento único

MediumCases

★Construiu uma versão em node de uma aplicação em java na metade do tempo com menos desenvolvedores

★Construiu uma versão em node de uma aplicação em java na metade do tempo com menos desenvolvedores

★A versão em node do app dobrou o número de req/sec

★Construiu uma versão em node de uma aplicação em java na metade do tempo com menos desenvolvedores

★A versão em node do app dobrou o número de req/sec

★Tempo de resposta caiu 35% (200ms)

★Construiu uma versão em node de uma aplicação em java na metade do tempo com menos desenvolvedores

★A versão em node do app dobrou o número de req/sec

★Tempo de resposta caiu 35% (200ms)

★De 1 a 12 apps em 6 meses

★ “Velocidade foi o ponto fundamental na mudança do PayPal para Node. Percebemos que habilitamos um enorme avanço em nosso workflow, nos permitindo iterar mais rápido e inovar mais”

★ “Velocidade foi o ponto fundamental na mudança do PayPal para Node. Percebemos que habilitamos um enorme avanço em nosso workflow, nos permitindo iterar mais rápido e inovar mais”

★ “PayPal tem uma história de tecnologias enterprise tais como Java e C++. Desde que adotamos Node, inúmeros engenheiros da empresa me contaram como estão energizados por seus trabalhos novamente e animados por estarem adotando uma tecnologia “moderna" para construir nosso futuro. Isso é bom de se ouvir”

Jeff Harrel, Director of UI Engineering

★ “Velocidade foi o ponto fundamental na mudança do PayPal para Node. Percebemos que habilitamos um enorme avanço em nosso workflow, nos permitindo iterar mais rápido e inovar mais”

★ “PayPal tem uma história de tecnologias enterprise tais como Java e C++. Desde que adotamos Node, inúmeros engenheiros da empresa me contaram como estão energizados por seus trabalhos novamente e animados por estarem adotando uma tecnologia “moderna" para construir nosso futuro. Isso é bom de se ouvir”

Jeff Harrel, Director of UI Engineering

Economia, Produtividade, Inovação

Motivação do desenvolvedor

★ “Todo o nosso stack mobile é construído completamente com Node. Uma razão foi escalabilidade. A segunda é que o Node nos mostrou enormes ganhos de performance”

Kiran Prasad Director of Engineering, Mobile

★ “Todo o nosso stack mobile é construído completamente com Node. Uma razão foi escalabilidade. A segunda é que o Node nos mostrou enormes ganhos de performance”

Kiran Prasad Director of Engineering, MobileEscalabilidade, Performance

★ “Uma organização de notícias deve ser responsiva, tanto para seus leitores quanto para um fluxo acelerado de informação. Node provê um nível de flexibilidade que não encontramos em nenhum outro lugar — e nos permite entregar apps performáticos que podem ser facilmente ajustados.”

Trevor LandauSoftware Engineer, Mobile Web

★ “Uma organização de notícias deve ser responsiva, tanto para seus leitores quanto para um fluxo acelerado de informação. Node provê um nível de flexibilidade que não encontramos em nenhum outro lugar — e nos permite entregar apps performáticos que podem ser facilmente ajustados.”

Trevor LandauSoftware Engineer, Mobile Web

Flexibilidade

★Servindo 50k req/min (há +8 meses atrás antes do lançamento em 48+ países)

★Serviços Node agora estão aguentando a mesma quantidade de tráfego de antes mas com menos hardware

★Tempos de carregamento de páginas caiu em 50%

★Facilidade em implementar funcionalidades em grande amplitude e mudanças no projeto muito mais rapidamente

★Servindo 50k req/min (há +8 meses atrás antes do lançamento em 48+ países)

★Serviços Node agora estão aguentando a mesma quantidade de tráfego de antes mas com menos hardware

★Tempos de carregamento de páginas caiu em 50%

★Facilidade em implementar funcionalidades em grande amplitude e mudanças no projeto muito mais rapidamente

Economia, Produtividade,

Inovação

★55% de todo tráfego na Black Friday foi para os servidores Node. Sequer um servidor Node caiu.

★Em plena Black Friday e a utilização de CPU pairou em torno dos 1%. Os desenvolvedores estavam entediados!

★55% de todo tráfego na Black Friday foi para os servidores Node. Sequer um servidor Node caiu.

★Em plena Black Friday e a utilização de CPU pairou em torno dos 1%. Os desenvolvedores estavam entediados! Economia,

Motivação do desenvolvedor

★Em média, serviços Node manejam cerca de 2M req/min

★Yahoo tem cerca de 200 devs para Node

★500 módulos internos, 800 externos

★ “Maior ganho: velocidade e facilidade de desenvolvimento”

★Em média, serviços Node manejam cerca de 2M req/min

★Yahoo tem cerca de 200 devs para Node

★500 módulos internos, 800 externos

★ “Maior ganho: velocidade e facilidade de desenvolvimento”

Produtividade

Ecossistema

Ecossistema

NPM

NPM★Node Package Manager

NPM★Node Package Manager

★Similar ao Ruby Gems, Maven…

NPM★Node Package Manager

★Similar ao Ruby Gems, Maven…

★ Integração com GitHub

NPM★Node Package Manager

★Similar ao Ruby Gems, Maven…

★ Integração com GitHub

★Facilidade em criar/manter pacotes

NPM★Node Package Manager

★Similar ao Ruby Gems, Maven…

★ Integração com GitHub

★Facilidade em criar/manter pacotes

★Maior engajamento / fortalecimento da comunidade

Testes★Mocha

★Sinon

★Buster

★Jasmine

★QUnit

★Chai

★Karma

★PhantomJS

Automatizadores

Automatizadores★Gulp, Grunt, Broccoli…

Automatizadores★Gulp, Grunt, Broccoli…

★Similares de outros ecossistemas: Makefile, Rakefile, Ant, Maven…

Automatizadores★Gulp, Grunt, Broccoli…

★Similares de outros ecossistemas: Makefile, Rakefile, Ant, Maven…

★Configurações declarativas (Grunt) ou JS puro (Gulp)

Integração Contínua★Travis

★Jenkins

★Strider

★…

Plataformas★Nodejitsu

★Heroku

★Azure

★Amazon EC2

★+ várias (https://github.com/joyent/node/wiki/node-hosting)

Links & Perguntas★bitly.com/bundles/luizmarelo/2

★gojs.org

linkedin.com/in/luizgonzaga

@luizmarelo

Obrigado!