Loucos por TecnologiaUm blog sobre tecnologia, inovação e marketing para ensino online.

Desenvolvido para impactar
e otimizar resultados.

Acompanhe e faça parte!

Seu e-mail está seguro. Vamos enviar apenas dicas relevantes para o seu EAD.

Como abraçamos o ES6 em nossas aplicações – Parte 1

Se você trabalha com Javascript, seja com Node.js ou outras aplicações web, provavelmente conhece ou já ouviu falar sobre ES6. O Ecmascript, conhecido como a linguagem da web,  é a base do próprio Javascript e de outras linguagens como ActionScript. A nova versão veio para elevar o patamar da linguagem. Com inúmeras novas features, irá melhorar (e muito) nossa […]

Como nós abraçamos o ES6 em nossas aplicações

Se você trabalha com Javascript, seja com Node.js ou outras aplicações web, provavelmente conhece ou já ouviu falar sobre ES6. O Ecmascript, conhecido como a linguagem da web,  é a base do próprio Javascript e de outras linguagens como ActionScript. A nova versão veio para elevar o patamar da linguagem. Com inúmeras novas features, irá melhorar (e muito) nossa relação com o Javascript, tais como classes, arrow functions, modules e várias outras.

Nós do Edools sempre estivemos animados sobre essa evolução. Entretanto, até algum tempo víamos como algo distante e que não seria usado tão cedo. O surgimento de transpilers, que traduziam código ES6 em ES5, mudou esse patamar.

Transpilers

Creio que o primeiro contato que eu tive com transpilers para javascript foi quando conheci o CoffeeScript, Ele tornou a sintaxe do código muito mais agradável (principalmente para rubysts). Também adicionou algumas funcionalidades como lambdas e template strings. Desde então muitos transpilers surgiram com propostas e objectivos totalmente diferentes tais como TypeScript, Dart, JSX e até alguns só de zoeira como o DogeScript (meu favorito).

Escolhendo o transpiler

Nosso desejo era usar ES6 em produção, porém teríamos que analisar as ferramentas possíveis para saber qual se encaixaria melhor. Na época o transpiler que parecia mais promissor era o traceur. Começamos a testar a migração de pequenas funcionalidades para ver logo o resultado disso em produção. Porém de cara esbarramos na necessidade de adicionar uma runtime que impactaria em performance, browser support, etc. Além do output do código compilado não ser muito legível e fácil de debugar sem sourcemaps.

Após tentar, sem sucesso, usar o traceur, partimos para um transpiler recém lançado mas que prometia muito: o 6to5. Novamente, tentamos colocar uma pequena feature em produção para testarmos seu impacto. E foi um sucesso :D. O 6to5 não requer uma runtime (há polyfills para algumas features, mas nada obrigatório) além de o ponto alto desse transpiler ser o output do código. É plenamente possível debugar seu código, mesmo sem sourcemaps (claro que eles ajudam muito, mas quanto mais legível melhor).

To be continued…

Esse foi o primeiro post de uma série para explicar como usamos ES6 em produção hoje em nossas aplicações Javascript. Nos próximos posts iremos dar uma abordagem mais prática mostrando com código como conseguimos melhorar a manutenibilidade das nossas aplicações AngularJS usando ES6.

Automatizando tarefas com web crawlers - Mechanize
Hello World!

Deixe uma resposta

Seu e-mail está seguro. Vamos enviar apenas dicas relevantes para o seu EAD.