Nos dias 19 e 20 de setembro, meus colegas e eu participamos da conferência AngularConnect. Esta é uma das maiores conferências angulares, este ano foi realizada pela quinta vez. O programa tinha 30 relatórios, dos quais 8 eram da equipe Angular, 4 oficinas e 5 zonas de especialistas. Por isso, valia a pena ir a Londres (bem, bem, sempre vale a pena uma viagem a Londres).
Neste artigo, explicaremos por que escolhemos o AngularConnect, quais tópicos eram interessantes para nós e o ajudaremos a decidir sobre a visualização dos relatórios do primeiro dia da conferência.
O programa
A primeira coisa que notamos quando decidimos ir ou não foi, é claro, o programa. 8 relatórios da equipe Angular, conhecidos por muitos desenvolvedores Angular John Papa, autor do blog Angular in Depth Max Koretskiy e muitos outros palestrantes famosos, são um elenco verdadeiramente estelar.
Mas o assunto não está apenas em grandes nomes. Os tópicos declarados pareciam extremamente relevantes para nossas tarefas de trabalho.
Esperávamos muito dos relatórios detalhados -
otimizações de desempenho no Angular do engenheiro do Google Mert Değirmenci e
aplicativos de criação de
perfil Angular como um tubarão sobre depuração de problemas de desempenho e memória. Tudo relacionado ao desempenho é importante para nós, porque criamos aplicativos interativos complexos.
As
mudanças de quebra de migração com o relatório
TSLint e Schematics também pareciam um acerto preciso. Temos uma biblioteca interna do Kit de interface do usuário, durante a qual muitas vezes encontramos um resultado negativo ao fazer alterações de última hora. Chegamos à necessidade de migrações automáticas, por isso foi interessante descobrir como os outros fazem isso.
Usamos o NgRx e monitoramos suas melhores práticas. Portanto, estávamos interessados em outro relatório aprofundado -
Quantum Facades: Por que as fachadas NgRx são terríveis ou impressionantes, dependendo de como você as observa . Queríamos ouvir as conclusões de Sam Julien e compará-las com as nossas.
E havia muitos desses cruzamentos!
Relatórios
O primeiro dia da conferência foi aberto por Stephen Fluin e Igor Minar.
Stephen agradeceu a comunidade pelo apoio e falou sobre o aumento do número de projetos Angular do Google de 600 em 2018 para 1.500 em 2019.
Igor disse que na CLI Angular 8.3 simplificou a montagem do ES 5 - isso permitiu reduzir o tempo gasto em 40%. Ele também falou sobre otimização no Angular 9: o peso dos artefatos diminuirá, os aplicativos começarão a funcionar mais rapidamente. Isso será possível devido ao novo Ivy render. Na nona versão da estrutura, as bibliotecas virão com o suporte do ViewEngine. E a partir da décima versão - com Ivy. Verifique a compatibilidade da biblioteca pelo
link .
Mergulhe fundo no compilador angular
Alex Rickabaugh, desenvolvedor do Angular Compiler, fala sobre as cinco etapas da compilação de um módulo Angular no código JavaScript. Ele usa um exemplo para analisar o modelo de compilação: o que era e o que será no Ivy. Escopos do NgModule, execução parcial do código e modelos aprimorados de verificação de tipo são as principais vantagens do Ivy, de acordo com Alex.
O relatório será útil para quem deseja entender em detalhes os recursos do compilador e entender em que estágios seu trabalho consiste.
Angular e o top 10 da OWASP
Philippe De Ryck recorda a classificação de vulnerabilidade OWASP 10, mas trata apenas de três delas em detalhes: XSS, Broken Auth e o uso de dependências com vulnerabilidades.
- Siga o caminho angular - a chave para a ausência de XSS.
- O Outh 2.0 e a biblioteca ajudarão a evitar problemas de autorização.
- Um projeto criado com o ng new possui 20 mil arquivos instalados que o desenvolvedor não controla. Os atacantes usam isso: o pacote npm electron-notify-native foi adicionado ao repositório popular. Depois de algum tempo, alteramos o código. Um repositório popular fica vulnerável ao atualizar dependências.
Recomendamos este relatório como uma introdução ao OWASP 10.
Minha jornada na equipe angular
Manu Murthy ingressou na equipe Angular em outubro de 2017. Em seu relatório, ele fala sobre três pontos principais durante esse período: mudar o foco na comunidade, melhorar os processos dentro da equipe e os desafios atuais. No final do relatório, ele fala sobre os projetos internos de 2019: cuidador, pesquisa escalada em código e ecossistema de conexão.
Dois anos da equipe Angular voaram para nós em meia hora. Eles não ficaram entediados. Se você quiser conhecer a estrutura de dentro, vai gostar do relatório.
Como tornamos angular rapidamente
Durante o desenvolvimento de Ivy, a equipe se concentrou no desempenho.
A maioria das conversas de Miško Hevery fala sobre como otimizar scripts js com o mecanismo V8. No exemplo de benchmarks, ele mostra o tempo de execução de funções monomórficas e polimórficas.
Miško observa programas úteis para trabalhar com criação de perfil V8. No final do relatório, ele apresenta as estruturas de dados no Ivy e anuncia o ngDevMode - um modo de depurar visualmente seu aplicativo no console do navegador.
A maior parte do relatório analisa otimizações de navegador de baixo nível. Adequado para desenvolvedores que desejam otimizar seus aplicativos o máximo possível.
Encontrar angular
Elana Olson fala sobre o ecossistema Angular: como criar um projeto, como estilizá-lo com o Material Angular, como adicionar serviços e por que eles são necessários. Em conclusão, Elana Olson explica como você pode ajudar a comunidade Angular e adicionar seu projeto ao ecossistema.
O relatório justifica o nível inicial. Adequado para novos desenvolvedores que concluíram recentemente o Tour of Heroes.
Os segredos por trás da velocidade da luz da Angular
Max Koretskyi aborda três níveis de otimização: tempo de execução do código, uso de estruturas de dados e operação do compilador.
- O cache em linha e as funções monomórficas ajudarão a acelerar a execução do código.
- O filtro Bloom acelerará o trabalho com estruturas.
- O compilador Ivy converte o modelo html em código JavaScript otimizado.
- Antes de assistir, recomendo que você se familiarize com o vídeo Miško. O relatório Max Koretskyi é mais fácil de entender porque os exemplos são da Angular. Descrição do trabalho O filtro Bloom é lembrado para sempre.
Criação de perfil de aplicativos angulares como um tubarão
Gil Fink começa com uma história sobre o processo de renderização no navegador, seus estágios, a diferença entre reflow e repintar, modelo RAIL. Em seguida, Gil passa a criar perfis e mostra com exemplos como encontrar áreas problemáticas usando a guia Desempenho no Chrome.
O relatório é adequado para familiarização com o processo de criação de perfil de aplicativos. Não há vínculos com o Angular, você pode recomendar amigos a funcionários de qualquer especialização.
Automatizando seus projetos angulares com o esquema
Brandon Roberts, do Nrwl, fala sobre os recursos da Esquema Angular. Eles podem ser úteis para automatizar tarefas de rotina: estabelecer dependências ao adicionar um pacote, executar operações adicionais ao atualizar. E com a ajuda dos esquemas, você pode adicionar modelos de código e facilitar a criação de entidades padrão. Por exemplo, Brandon mostra como adicionar um modelo para um serviço de API.
O relatório começa com o básico e é adequado para explorar a tecnologia.
O relatório de esboço encerrou o primeiro dia do programa. À nossa frente estava Angular-el, comunicação informal, caminha por Londres ... E o segundo dia da conferência, que discutiremos em um artigo separado.
As impressões da primeira metade da conferência permaneceram confusas. Por um lado, alguns relatórios foram realmente profundos, muito aprofundados com conteúdo em primeira mão, geralmente dos próprios criadores do Angular. Por outro lado, houve relatórios, cujo nível foi classificado abaixo do nível declarado. Mas o valor da conferência não está apenas nos relatórios - retornaremos a esta questão na segunda parte.