Angular 4

O que há de novo:

  • Menor e mais rápido
    • View Engine
    • Pacote de Animação
  • Novas características
    • Angular Universal
    • Compatibilidade com TypeScript 2.1 e 2.2
    • Source Maps for Templates
  • Packaging Changes

    • Flat ES Modules (Flat ESM / FESM)

    • Experimental ES2015 Builds

    • Compatibilidade de Encerramento Experimental

Menor e mais rápido

Nesta versão, foi cumprida promessa de tornar as aplicações Angulares menores e mais rápidas. De forma alguma já terminamos, e você verá mais melhorias nos próximos meses

View Engine

Alterações sob o hood para  AOT. Essas alterações reduzem o tamanho do código gerado para seus componentes em cerca de 60% na maioria dos casos. Quanto mais complexos forem seus modelos, maior será a economia.
Durante nosso período de candidatura à divulgação, ouvimos de muitos desenvolvedores que a migração para 4 reduziu seus bundles de produção em centenas de kilobytes.
Leia o Design Doc para saber mais sobre o que fizemos com o View Engine.

Pacote de Animação

Foi removido animações de @angular/core e em criamos seu próprio pacote. Isso significa que se você não usar animações, este código extra não vai acabar em seus pacotes de produção.
Esta alteração também permite que você encontre mais facilmente a documentação e aproveite melhor o preenchimento automático. Você pode adicionar animações ao seu NgModule principal importando o BrowserAnimationsModule de @angular/platform-browser/animations.

Novas características

Melhorado *ngIf e *ngFor

A sintaxe de vinculação de modelo agora suporta algumas mudanças úteis. Agora você pode usar uma sintaxe de estilo if /else e atribuir variáveis locais, como ao desenrolar um observable.

User {{i}} of {{count}}
Loading...

Loading…

Angular Universal

O Universal, o projeto que permite que os desenvolvedores executem o Angular em um servidor, agora está de novo atualizado com o Angular, e este é o primeiro lançamento desde que o Universal, originalmente um projeto dirigido pela comunidade, foi adotado pela equipe Angular.Esta versão agora inclui os resultados do trabalho interno e externo da equipe da Universal nos últimos meses. A maioria do código Universal está agora localizada em @angular/platform-server.Para saber mais sobre como tirar vantagem do Angular Universal, dê uma olhada no novo método renderModuleFactory no @angular/platform-server, ou no Demo Repository do Rob Wormald. Mais documentação e exemplos de código estão disponíveis.

Compatibilidade com TypeScript 2.1 e 2.2

Atualizamos o Angular para uma versão mais recente do TypeScript. Isso irá melhorar a velocidade do ngc e você obterá melhor tipo verificação em toda a sua aplicação.

Source Maps for Templates

Agora, quando há um erro causado por algo em um de seus modelos, geramos mapas de origem que dão um contexto significativo em termos do modelo original

 

Packaging Changes

Flat ES Modules (Flat ESM / FESM)

Agora enviamos versões comprimido de nossos módulos (versão “rolled up” do nosso código no formato EcmaScript Module, veja example file). Esse formato deve ajudar a tree-shaking, ajudar a reduzir o tamanho de seus bundles gerados e acelerar a compilação, transpilação e carregamento no navegador em determinados cenários.

Leia mais sobre a importância dos módulos Flat ES “The cost of small modules”.

Experimental ES2015 Builds

Agora também enviamos nossos pacotes no formato ES2015 Flat ESM. Esta opção é experimental e opt-in. Os desenvolvedores relataram até 7% de economia de tamanho de pacote ao combinar esses pacotes com o Rollup. Para testar esses novos pacotes, configure sua build de ferramentas de compilação para resolver a propriedade “es2015” em package.json sobre a propriedade regular “module”.

Compatibilidade de Encerramento Experimental

Todo o nosso código agora tem anotações de encerramento, tornando possível aproveitar as otimizações de fechamento avançadas, resultando em tamanhos de pacote menores e melhor tree shaking.