Представляємо Turbo для установки пакетів: В 5 разів швидше, ніж Yarn і NPM, і працює спочатку в браузері

16

Від автора: після чотирьох місяців напруженої роботи я радий нарешті представити Вам Turbo, з допомогою якого установка пакетів здійснюється легко і просто!

Представляємо Turbo для установки пакетів: В 5 разів швидше, ніж Yarn і NPM, і працює спочатку в браузері

Turbo — це швидкий NPM-клієнт, спочатку розроблявся для StackBlitz, який:

Встановлює пакунки до 5 разів швидше, ніж Yarn і NPM

Зменшує розмір node_modules до двох разів

Підтримує кілька рівнів додаткової обробки для забезпечення надійності робочих класів

Працює повністю в веб-браузері, дозволяючи прискорити розробку

Представляємо Turbo для установки пакетів: В 5 разів швидше, ніж Yarn і NPM, і працює спочатку в браузері

Фактична швидкість установки пакетів NPM з використанням Turbo на StackBlitz.com

Для чого це все?

Коли ми вперше почали працювати над StackBlitz, наша мета полягала в тому, щоб створити інтерактивну середу IDE, яка б дозволяла вам відчувати себе так само круто, як за кермом суперкара: чистрый захват від отримання миттєвих відповідей на кожну команду.

Це контрастує з досвідом, який можуть надати NPM і Yarn. Оскільки вони призначені для обробки великої кількості залежностей бекенда баз коду, необхідних для власних двійкових файлів та інших ресурсів, що той досвід, який вони пропонують, більше схожий на водіння старого повільного автомобіля, а не на управління суперкаром. Але для зовнішнього коду рідко потрібне підключення такої великої кількості залежностей — так питається, навіщо це робити? Однак, ці залежності, як і раніше, залучаються в процесі установки як dev — і sub — залежностей і завантажуються і витягуються всі так само. І в результаті ми отримуємо ту саму чорну діру, під назвою node_modules:

Представляємо Turbo для установки пакетів: В 5 разів швидше, ніж Yarn і NPM, і працює спочатку в браузері

Наведений вище мем добре ілюструє ситуацію

Це саме те, що не дозволяє NPM працювати в браузері. Перетворення, завантаження та виймання сотень мегабайт (або гігабайт) даних, які стандартні проекти містять у папці node_modules стають непосильним завданням для браузера. Це також пов’язано з тим, що існуючі серверні рішення цієї проблеми виявилися повільними, ненадійними і дорогими для масштабування.

Отже, якщо NPM сам не може працювати в браузері, що, якщо ми побудуємо абсолютно новий NPM-клієнт з нуля?

Рішення: більш розумний, швидкий менеджер пакетів, створений спеціально для Інтернету

Швидкість і ефективність Turbo значною мірою досягаються за рахунок використання тих же самих технологій, які застосовують сучасні інтерфейсні програми для збільшення продуктивності — tree-shaking, отложеная завантаження і прості XHR / вибірки з допомогою gzip.

Витягує тільки файли, які вам справді потрібні, за запитом

Замість того, щоб завантажувати всі архіви, Turbo працює інтелектуально і витягує з основних, типізованих та інших відповідних полів тільки файли, які безпосередньо необхідні. Це дозволяє позбутися від величезної кількості мертвого об’єму в окремих пакетах і, тим більше, у великих проектах:

Представляємо Turbo для установки пакетів: В 5 разів швидше, ніж Yarn і NPM, і працює спочатку в браузері

Порівняння загального розміру стислій корисного навантаження для RxJS і RealWorld Angular

Отже, що станеться, якщо ви імпортуєте файл, який потрібно в основному полі, наприклад, файл Sass ? Немає проблем — Turbo просто відкладено завантажує його на вимогу і зберігає для майбутнього використання, подібно до того, як працює новий протокол GVFS Git від Microsoft.

Надійне кешування з безліччю стратегій переходу на інший ресурс

Нещодавно ми випустили CDN спеціально під Turbo, який збирає будь пакет NPM в одному запиті JSON з підтримкою gzipped, що дозволило значно прискорити процес завантаження пакетів. Ця концепція схожа на tarballs NPM, яка об’єднує всі файли в пакеті і архівує їх у gzips, в той час як таймер Turbo розумно поєднує тільки файли, які потрібно вашому додатку, і архівує їх у gzips.

Кожен клієнт Turbo працює автономно в браузері і автоматично завантажує відповідні файли за запитом безпосередньо з CDN класу продуктивності jsDelivr, якщо пакет не може бути вилучено з кешу. Але що, якщо jsDelivr теж опущений? Без проблем — він потім перемикається на використання CDN від Unpkg, надаючи вам три окремих рівня альтернативної обробки для наднадійною установки пакетів.

Блискавична обробка залежностей

Щоб забезпечити мінімальні розміри корисного навантаження, Turbo використовує алгоритм користувальницького дозволу для агресивного перетворення загальних версій пакетів, коли це можливо. Це також понад швидке і надійне рішення: безсерверная версія розпізнавання, що має доступ до повного набору даних NPM в пам’яті і перетворює будь package.json менше ніж за 85 мс. Якщо у Turbo є які-небудь проблеми з підключенням до безсерверному перетворювача, він коректно виходить з процесу в браузері і витягує всі необхідні метадані для перетворення.

Виконання перетворення залежностей в клієнті також відкриває нові захоплюючі перспективи, такі як можливість встановлення відсутніх тимчасових залежностей всього в один клік:

Представляємо Turbo для установки пакетів: В 5 разів швидше, ніж Yarn і NPM, і працює спочатку в браузері

Оскільки ніхто не читає ці попередження про те, що пайпи npm виводять на консоль

Масштабованість перевірена на практиці

Turbo тепер надійно обробляє десятки мільйонів запитів кожен місяць, використовуючи при цьому незначна кількість ресурсів, і ми раді оголосити, що команда Google Angular нещодавно обрала StackBlitz для включення всіх онлайн-прикладів, які мільйони розробників використовують в своїх документах!

Тепер наша технологія доступна для ознайомлення і тестування онлайн

Turbo розміщений на онлайн StackBlitz.com і під час фази попереднього ознайомлення з технологією ми будемо запускати величезну кількість тестів, що демонструють його швидкість, ефективність і надійність, і всі ваші відгуки мають вирішальне значення — так що, будь ласка, пишіть про будь-які проблеми, з якими ви стикаєтеся, або зв’язуйтеся з нами в нашому співтоваристві Olympus!

У той час як Turbo спочатку був призначений для використання в серійній версії в реальному середовищі IDE, деякі люди вже застосували його на декількох ігрових майданчиках, а учасники нашої спільноти навіть почали прототипування методу включення скрипта type=module для роботи з Turbo (круто, правда?). Ми не можемо дочекатися того моменту, коли побачимо інші чудові речі, які придумають люди, тому, як тільки перевірка API буде завершена, ми відкриємо вихідні коди Turbo (як і багатьох інших частин StackBlitz) в нашому нашому сховищі на Github.

Нарешті, ми хочемо сердечно подякувати команді Google Angular за те, що вона вирішила зробити ставку на наші технології, і команду Google Cloud за їх чудовий сервіс плюс спонсорування серверів, на яких працює Turbo!