Tinjauan Umum AngularConnect 2019. Bagian 1

Pada 19 dan 20 September, saya dan kolega saya menghadiri konferensi AngularConnect. Ini adalah salah satu konferensi Angular terbesar, tahun ini diadakan untuk kelima kalinya. Program ini memiliki 30 laporan, dimana 8 berasal dari tim Angular, 4 lokakarya dan 5 zona pakar. Demi ini, layak pergi ke London (well, well, selalu bernilai perjalanan ke London).

Dalam artikel ini, kami akan menjelaskan mengapa kami memilih AngularConnect, topik apa yang menarik bagi kami, dan membantu Anda memutuskan untuk melihat laporan hari pertama konferensi.

Programnya

Hal pertama yang kami perhatikan ketika memutuskan untuk pergi atau tidak, tentu saja, programnya. 8 laporan dari tim Angular, yang diketahui oleh banyak pengembang Angular John Papa, penulis blog Angular in Depth Max Koretskiy, dan banyak pembicara terkenal lainnya adalah pemain yang benar-benar bintang.

Tapi masalahnya bukan hanya nama besar. Topik yang disebutkan tampak sangat relevan dengan tugas pekerjaan kami.

Kami berharap banyak dari laporan selam - Optimalisasi kinerja di Angular dari Google engineer Mert Değirmenci dan Profiling aplikasi Angular seperti hiu tentang debugging kinerja dan masalah memori. Segala sesuatu yang berkaitan dengan kinerja penting bagi kami, karena kami membuat aplikasi interaktif yang kompleks.

Migrasi melanggar perubahan dengan laporan TSLint dan Skema juga tampak seperti hit yang akurat. Kami memiliki pustaka Kit UI internal, selama pengembangan yang sering kami temui negatif ketika kami membuat perubahan. Kami sampai pada kebutuhan untuk migrasi otomatis, jadi menarik untuk mengetahui bagaimana orang lain melakukannya.

Kami menggunakan NgRx dan memantau praktik terbaiknya. Oleh karena itu, kami tertarik pada laporan penyelaman dalam lainnya - Quantum Facades: Why NgRx Facades mengerikan atau mengagumkan tergantung pada bagaimana Anda mengamatinya . Kami ingin mendengarkan kesimpulan Sam Julien dan membandingkannya dengan kami.

Dan ada banyak persimpangan seperti itu!

Laporan

Hari pertama konferensi dibuka oleh Stephen Fluin dan Igor Minar.

Stephen mengucapkan terima kasih kepada komunitas atas dukungan mereka dan berbicara tentang peningkatan jumlah proyek Angular Google dari 600 pada 2018 menjadi 1.500 pada 2019.

Igor mengatakan bahwa dalam Angular CLI 8.3 disederhanakan perakitan untuk ES 5 - ini memungkinkan untuk mengurangi waktu yang dihabiskan sebesar 40%. Dia juga berbicara tentang pengoptimalan dalam Angular 9: bobot artefak akan berkurang, aplikasi akan mulai bekerja lebih cepat. Ini akan dimungkinkan karena render Ivy baru. Dalam versi kesembilan kerangka kerja, perpustakaan akan datang dengan dukungan ViewEngine. Dan dari versi kesepuluh - dengan Ivy. Periksa kompatibilitas perpustakaan dengan tautan .

Menyelam jauh ke kompiler sudut

Alex Rickabaugh, pengembang Angular Compiler, berbicara tentang lima langkah mengkompilasi modul Angular ke dalam kode JavaScript. Dia menggunakan contoh untuk menganalisis model kompilasi: apa itu dan apa yang akan terjadi di Ivy. Lingkup NgModule, eksekusi kode parsial, dan templat pengecekan tipe yang ditingkatkan adalah keunggulan utama Ivy, menurut Alex.

Laporan ini akan bermanfaat bagi mereka yang ingin memahami secara terperinci fitur-fitur dari kompiler dan memahami tahapan pekerjaannya.

Sudut dan OWASP top 10

Philippe De Ryck mengingat peringkat kerentanan OWASP 10, tetapi hanya membahas tiga di antaranya secara terperinci: XSS, Patah Auth, dan penggunaan dependensi dengan kerentanan.

1. Ikuti cara sudut - kunci untuk tidak adanya XSS.
2. OAuth 2.0 dan perpustakaan akan membantu menghindari masalah otorisasi.
3. Sebuah proyek yang dibuat dengan ng baru memiliki 20 ribu file yang diinstal yang tidak dikontrol pengembang. Penyerang menggunakan ini: paket npm electron-notify-asli telah ditambahkan ke repositori populer. Setelah beberapa waktu, kami mengubah kode. Repositori populer mendapat kerentanan saat memperbarui dependensi.

Kami merekomendasikan laporan ini sebagai pengantar untuk OWASP 10.

Perjalanan saya di tim sudut

Manu Murthy bergabung dengan tim Angular pada Oktober 2017. Dalam laporannya, ia berbicara tentang tiga poin utama selama ini: mengubah fokus pada komunitas, meningkatkan proses dalam tim, dan tantangan saat ini. Di akhir laporan, ia berbicara tentang proyek-proyek magang tahun 2019: Pengurus, Penelusuran dalam skala besar dalam kode dan Connecting Ecosystem.

Dua tahun tim Angular terbang untuk kami dalam waktu setengah jam. Mereka tidak bosan. Jika Anda ingin mengetahui kerangka dari dalam, Anda akan menyukai laporannya.

Bagaimana kita membuat sudut cepat

Selama pengembangan Ivy, tim fokus pada kinerja.

Sebagian besar pembicaraan oleh Miško Hevery berbicara tentang mengoptimalkan skrip js dengan mesin V8. Pada contoh tolok ukur, ia menunjukkan waktu pelaksanaan fungsi monomorfik dan polimorfik.
Miško mencatat program yang berguna untuk bekerja dengan profiling V8. Di akhir laporan, ia menyajikan struktur data di Ivy dan mengumumkan ngDevMode - mode untuk debugging aplikasi Anda secara visual di konsol browser.

Sebagian besar laporan mem-parsing optimasi browser tingkat rendah. Cocok untuk pengembang yang ingin mengoptimalkan aplikasi mereka sebanyak mungkin.

Menemukan sudut

Elana Olson berbicara tentang ekosistem Angular: cara membuat proyek, cara menatanya dengan Bahan Angular, cara menambahkan layanan, dan mengapa dibutuhkan. Sebagai kesimpulan, Elana Olson menjelaskan bagaimana Anda dapat membantu komunitas Angular dan menambahkan proyek Anda ke ekosistem.

Laporan ini membenarkan tingkat Pemula. Cocok untuk pengembang baru yang baru saja menyelesaikan Tur Pahlawan.

Rahasia di balik kecepatan kilat Angular

Max Koretskyi membahas tiga level optimisasi: waktu eksekusi kode, penggunaan struktur data, dan operasi kompiler.

1. Caching inline dan fungsi monomorfik akan membantu mempercepat eksekusi kode.
2. Filter Bloom akan mempercepat pekerjaan dengan struktur.
3. Kompiler Ivy mengubah templat html menjadi kode JavaScript yang dioptimalkan.
4. Sebelum menonton, saya sarankan Anda membiasakan diri dengan video Miško. Laporan Max Koretskyi lebih mudah dipahami karena contohnya dari Angular. Deskripsi Pekerjaan Filter Bloom diingat selamanya.

Membuat profil Aplikasi sudut seperti hiu

Gil Fink dimulai dengan sebuah cerita tentang proses rendering di browser, tahapan-tahapannya, perbedaan antara reflow dan pengecatan ulang, model RAIL. Kemudian Gil melanjutkan pembuatan profil dan menunjukkan dengan contoh bagaimana menemukan area masalah menggunakan tab Performance di Chrome.

Laporan ini cocok untuk pengenalan proses pembuatan profil aplikasi. Tidak ada ikatan dengan Angular, Anda dapat merekomendasikan teman ke garis depan spesialisasi apa pun.

Mengotomatiskan proyek Angular Anda dengan Skema

Brandon Roberts Nrwl berbicara tentang fitur Skematis Angular. Mereka dapat berguna untuk mengotomatisasi tugas-tugas rutin: membangun dependensi saat menambahkan paket, melakukan operasi tambahan saat memperbarui. Dan dengan bantuan skema, Anda dapat menambahkan templat kode dan memfasilitasi pembuatan entitas standar. Misalnya, Brandon menunjukkan cara menambahkan templat untuk layanan API.

Laporan dimulai dengan dasar-dasar dan cocok untuk mengeksplorasi teknologi.



Laporan sketsa menutup program hari pertama. Di depan kami adalah Angular-el, komunikasi informal, berjalan di sekitar London ... Dan hari kedua konferensi, yang akan kita bahas dalam artikel terpisah.



Tayangan dari paruh pertama konferensi tetap beragam. Di satu sisi, beberapa laporan benar-benar dalam, penyelaman nyata dengan konten tangan pertama, seringkali dari pencipta Angular sendiri. Di sisi lain, ada laporan, tingkat yang kami beri peringkat di bawah tingkat yang dinyatakan. Tetapi nilai konferensi tidak hanya dalam laporan - kami akan kembali ke masalah ini di bagian kedua.