TypeScript vs Flow

No segundo semestre de 2018

Quem sou eu?

Larissa Thaís de Farias

• Atuo com ReactJs e Redux desde o final de 2016 no projeto Rung
• Já mexi com React Native + Expo pro app do Rung
• Certificada em HTML5 com JavaScript e CSS3 pela Microsoft
• Hoje trabalho na VanHack

larissathasdefar@hotmail.com              /larissathasdefar

Tipagem estática

      Essa apresentação é baseado no meu post do medium:

 

 

 

 

 

 

 

 

 

https://medium.com/rung-brasil/typescript-vs-flow-no-segundo-semestre-de-2018-54af2d4325d1

Tipagem estática

Benefícios:

• Pegar erros em tempo de compilação ao invés de runtime
• Melhora da leitura e auxilio na refatoração do código
• Traz sugestões mais precisas na IDE

 

É recomendado a utilização de tipagem estática quando:

• Seu projeto é grande e complexo
• Um time grande será responsável pelas atividades
• Você pode querer refatorar o programa a longo prazo
• Seu time é familiarizado com linguagens de tipagem estática

TypeScript vs Flow

O Flow é um typechecker criado pelo Facebook para JavaScript, podendo realizar inferência de tipos através de análise de código, assim você não precisa tipar tudo (mas quanto mais, melhor) e tem a promessa de fácil integração com feedback em tempo real.

 

Já o TypeScript é um superset do JavaScript que compila pra JavaScript puro e foi criado pela Microsoft. Se você utiliza o VsCode, ele já vem configurado para dar suporte a TypeScript.

TypeScript vs Flow

Após ler os artigos abaixo e trocar uma ideia com o Sibelius e o Marcelo...

• Flow vs TypeScript — My two cents
• Comparing Flow with TypeScript
• Strict Types: Typescript, Flow, Javascript — to be or not to be?

 

...cheguei as seguintes conclusões:

TypeScript

Prós

• Comunidade maior: Por ser mais antigo que o Flow, sua comunidade é maior e possui mais definições
• Suporte do VS code é aparentemente melhor que o do Flow

Contras

• Mais verboso

Flow

Prós

• Fácil integração e refatoração automática — Por ser baseado no Babel, ele se integra com várias ferramentas e caso precise, é possível utilizar uma ferramenta de refatoração automática como o react-codemod por exemplo

Contras

• “Move fast and breaks things” — É comum que de uma versão pra outra tenha grandes mudanças
• Funcionalidades não documentadas — Nem todos os tipos são documentados
• Nem sempre as mensagens de erro são claras — Dentro do erro exibido na IDE, o Flow adiciona placeholders como [1] [2], isso é meio confuso as vezes

A escolha

TypeScript*

 

Por possuir uma comunidade maior e mais antiga, possui muitas definições de tipos feitas e com a versão TS3 se tornou tão bom quanto o Flow para tipagem de React.

* Apenas lembrando que a escolha pode mudar de projeto para projeto

Mas e o Flow?

Quando eu recomendaria usar o Flow?

 

• Você é iniciante no assunto de tipagem estática
• Seu projeto não é muito grande
• Você tem preferência por ele

 

E dependendo das atualizações que vierem, ele pode tomar a dianteira de TS.

Obrigada :)

I don't know why. Just move on.
i dunno, maybe this works
arrrggghhhhh fixed!

larissathasdefar@hotmail.com              /larissathasdefar