Turbo bilan tanishish: Yigirilgan ip va NPM-ga qaraganda 5 baravar tezroq ishlaydi va mahalliy brauzerda ishlaydi

Eslatma: Ushbu ma'ruza Google-ning Mountain View kampusida 6-dekabr, chorshanba kuni aytilgan - qo'shiling!

To'rt oylik mashaqqatli ishdan so'ng, men nihoyat Turbo haqida e'lon qilishdan xursandman!

Turbo dastlab StackBlitz uchun qurilgan tezkor NPM mijozidir:

  • Paketlarni yigirilgan ip va NPM than-ga qaraganda x5x tezroq o'rnatadi
  • Tugun_modullari hajmini ikkita kattalik orders darajasigacha qisqartiradi
  • Ishlab chiqarish darajasining ishonchliligi red uchun ko'p sonli ortiqcha zaxiraga ega
  • To'liq veb-brauzeringizda ishlaydi, chaqmoq tezkor muhitini yaratadi ️
StackBlitz.com saytidagi Turbo yordamida NPM paketlarini o'rnatish tezligi

Nima uchun?

Biz StackBlitz-da birinchi marta ish boshlaganimizda, bizning maqsadimiz superkarning orqasida bo'lish kabi hissiyotni uyg'otadigan onlayn IDE yaratish edi: bu sizning har bir buyrug'ingizga darhol javob berishdan juda mamnun.

Bu NPM va yigirilgan ipning mahalliy sharoitda ishlashi bilan taqqoslanadi. Ikkilik ikkiliklar va boshqa aktivlar uchun talab qilinadigan ulanadigan zaxira kodlari bazalarini boshqarish uchun yaratilganligi sababli ularni o'rnatish jarayoni superkarga qaraganda yarim yuk mashinasiga ko'proq o'xshashlikni talab qiladi. Ammo frontend kodi kamdan-kam hollarda bunday katta qaramlikka tayanadi, shuning uchun muammo nimada? Xo'sh, ushbu bog'liqliklar hali ham o'rnatish jarayonida dev va quyi bog'liqliklar sifatida sirg'anmoqda va yuklab olinadi va olinadi, natijada node_modules deb nomlanuvchi shafqatsiz qora tuynuk paydo bo'ladi:

Dank, tegishli mem (yuqoridagi rasm)

Bu NPM-ning mahalliy brauzerda ishlashiga to'sqinlik qiladigan narsa. O'zlarining node_modules papkasida joylashgan yuzlab megabaytli (yoki gigabaytli) tipik oldingi loyihalarni hal qilish, yuklab olish va chiqarib olish brauzerlarning qiyin vazifasi. Bundan tashqari, shuning uchun ushbu muammoni hal qilish uchun mavjud server tomonidan echimlar sekin, ishonchsiz va xarajatlarni taqiqlovchi ekanligi isbotlandi.

Shunday qilib, agar NPMning o'zi brauzerda ishlay olmasa, biz yangi NPM mijozini erdan turib qursak nima bo'ladi?

Yechim: Maxsus veb uchun yaratilgan tezroq tezroq paket menejeri

Turbo tezligi va samaradorligiga ko'p jihatdan zamonaviy ishlash uchun ishlatiladigan texnikani - daraxtni silkitib qo'yish, dangasa yuklash va gzip bilan oddiy XHR / tushirish usullarini qo'llash orqali erishiladi.

Talab qilib, faqat kerakli fayllarni oladi

To'liq tarbollarni yuklab olish o'rniga, Turbo aqlli va faqat asosiy, yozuvlardan va boshqa tegishli maydonlardan to'g'ridan-to'g'ri talab qilinadigan fayllarni oladi. Bu individual paketlardagi hayratlanarli miqdordagi o'lik vaznni yo'q qiladi va hatto katta loyihalarda:

RxJS va RealWorld Angular uchun siqilgan yukning umumiy hajmini taqqoslash

Agar asosiy maydon tomonidan talab qilinmaydigan faylni, masalan, Sass fayli kabi import qilsangiz nima bo'ladi? Muammo yo'q - Turbo shunchaki dangasa, uni talabga binoan yuklaydi va uni kelgusida foydalanish uchun saqlab qo'yadi, xuddi Microsoftning yangi GVFS Git protokoli qanday ishlaydi.

Bir nechta muvaffaqiyatsiz strategiyalar bilan ishonchli keshlash

Yaqinda biz har qanday NPM paketini bitta giplangan JSON talabiga binoan nemlendiradigan va paketlarni o'rnatishda katta tezlikni ta'minlaydigan Turbo-ga o'xshash CDN-ni tarqatdik. Ushbu kontseptsiya NPM-ning shpallariga o'xshaydi, ular paketdagi barcha fayllarni yig'adi va ularni siqib chiqaradi, Turbo-ning keshi esa faqat sizning dasturingiz talab qiladigan va ularni gip-fayllarini siqib chiqaradigan fayllarni aqlli ravishda jamlaydi.

Har bir Turbo mijoz mustaqil ravishda brauzerda ishlaydi va agar paketni keshimizdan olishning iloji bo'lmasa, to'g'ridan-to'g'ri jsDelivr-ning ishlab chiqarish darajasidagi CDN-dan avtomatik ravishda yuklab oladi. Ammo jsDelivr ham pastga tushsa nima bo'ladi? Hech qanday ter yo'q - u o'rniga Unpkg ning CDN-dan foydalanishga o'tadi va sizga ultra ishonchli paketlarni o'rnatish uchun uchta alohida qatlamni qaytarib beradi.

Yildirimning tez bog'liqligi resolution️

Minimal yuk hajmini ta'minlash uchun, Turbo, odatiy paketlar versiyalarini iloji boricha agressiv hal qilish uchun maxsus piksellar sonini aniqlash algoritmidan foydalanadi. Bundan tashqari, juda tezkor va ortiqcha: hal qiluvchi vositasining serversiz versiyasi NPM-ning butun ma'lumotlar bazasiga kirish huquqiga ega va har qanday pack.json-ni <85 ms ichida hal qiladi. Agar Turbo serversiz hal qiluvchiga ulanishda muammolarga duch kelsa, u to'liq brauzerda ishlamaydi va hal qilish uchun barcha kerakli metadata ma'lumotlarini oladi.

Mijozga bog'liqlikni hal qilish, shuningdek, yo'qolgan tengdoshga bog'liqlikni bir marta bosish orqali o'rnatish imkoniyati kabi yangi va ajoyib imkoniyatlarni ochadi :

Chunki hech kim npm naychani konsolga kiritishi haqidagi ogohlantirishni hech kim o'qimaydi

Scale miqyosda ishlash isbotlangan

Endilikda Turbo har oyda o'nlab millionlab so'rovlarni arzimagan ortiqcha xarajatlar bilan ishonchli tarzda ko'rib chiqmoqda va biz shuningdek, Google-ning Angular jamoasi yaqinda StackBlitz-ni millionlab ishlab chiquvchilar o'z hujjatlarida ishlatadigan barcha jonli misollarni qo'llab-quvvatlash uchun tanlaganligini e'lon qilishdan mamnunmiz!

Endi texnologiyani oldindan ko'rib chiqish

Turbo StackBlitz.com-da jonli efirda va texnologiyani ko'rib chiqish bosqichida biz bir nechta sinovlarni o'tkazamiz va tezlikni, samaradorlik va ishonchlilikni yaxshilaymiz, bularning barchasi sizning fikr-mulohazangiz muhim ahamiyatga ega - shuning uchun iltimos, hech qanday ma'lumot yubormang. siz bizning Discord hamjamiyatida siz bilan yoki biz bilan suhbatlashadigan masalalar!

Turbo dastlab haqiqiy IDE-da ishlab chiqarish sinfini ishlatish uchun ishlab chiqilgan bo'lsa-da, uning qismlari allaqachon bizning jamoamizdagi bir nechta onlayn o'yin maydonchalari va xalqlarga kirib bordi, hatto skript turi = modulini Turbo bilan ishlashga imkon beradigan usulni yaratishga kirishdi. bu qanday ajoyib!). Odamlar o'ylab topgan boshqa ajoyib narsalarni ko'rishlarini kutib o'tirmaymiz, shuning uchun bizning API ishlamay qolishi bilan biz butun dunyo bo'ylab Github repo-da (va StackBlitzning boshqa qismlari) manbasini ochamiz. foydalanish

Va nihoyat, biz Google-ning Angular jamoasiga bizning texnologiyamizga va Google Cloud jamoasiga ajoyib xizmat + Turbo ishlaydigan serverlarni qo'llab-quvvatlaganlari uchun katta rahmat aytmoqchimiz!

Har doimgidek, iltimos, menga har qanday savol, mulohaza, fikrlar va hk bilan @ ericsimons40 yoki @stackblitz sahifalarini tvitter orqali yuborishingiz mumkin :)

PS - Agar siz bizning ishimizni qo'llab-quvvatlamoqchi bo'lsangiz, iltimos, Thinkster Pro obunasi haqida o'ylab ko'ring! Biz Turbo & StackBlitz-ni qanday yaratganimiz va shuningdek, butun tarkibimiz katalogini yangilaganimiz uchun yangi seriyalar yaratmoqdamiz :)

Mountain Rock-da 6 dekabr, chorshanba kuni ko'raman deb umid qilaman!