@unfapable

Что значит и как перевести на русский tree shaking?

Непонятно, что такое "tree shaking" и как его можно перевести на русский, чтобы лучше понимать.
  • Вопрос задан
  • 1970 просмотров
Решения вопроса 3
rockon404
@rockon404
Frontend Developer

Tree shaking (встряхивание дерева) — термин объединения модулей JavaScript, обозначающий статический анализ всего импортированного кода и исключение того, что на самом деле не используется.

Для более прямолинейной аналогии рассмотрим живое дерево. Дерево встряхивается, и это заставляет мертвые листья отваливаться, оставляя только живые. В основе tree shaking лежит концепция живого включения кода (live code inclusion): мы включаем части, необходимые для начала, в отличие от удаления ненужных частей в конце — устранения «мертвого кода» (dead code elimination).

Tree shaking зависит от import и export модулей ES2015. Выражения import и export составляют статическую структуру модуля приложения. Когда модули объединяются для развертывания приложения, tree shaker анализирует статическую структуру модуля, чтобы исключить неиспользуемый экспорт, уменьшив размер окончательного пакета.

ES2015 позволяет указывать явный импорт. Например, вместо импорта всей библиотеки RxJS мы можем импортировать именно то, что хотим:

import { BehaviorSubject } from 'rxjs/BehaviorSubject';

Это отличается от динамического выражения require, используемого CommonJS или AMD. Tree shaking использует этот принцип для перемещения по зависимостям и исключения ненужных зависимостей для уменьшения размера приложения.

Принцип tree shaking не нов, но он только недавно был популяризирован с помощью сборщика rollup.js, объединяющего модули приложения. Webpack 2 также использует tree shaking. Концепция tree shaking также распространена в Angular с компиляцией AOT.

Источник
Ответ написан
Комментировать
Tree shaking (встряска дерева) — это функция некоторых бандлеров и анализаторов кода. Смысл заключается в том, что бандлер/анализатор просматривает весь код и строит на его основе абстрактное синтаксическое дерево (Abstract Syntax.... Говоря простым языком, это структура данных, с помощью которой компиляторы и машинные анализаторы "понимают" синтаксис кода: инструкции, объявления, вызовы в нем представлены ветвями и листьями. Именно об этом дереве и идет речь.

"Встряхнуть" синтаксическое дерево — значит, вычислить, какие инструкции в коде никогда не вызываются и не исполняются, и удалить их из бандла, чтобы его облегчить. Аналогия в том, что когда трясешь натуральное дерево, засохшие листья и ветки отваливаются.
Ответ написан
Комментировать
iCoderXXI
@iCoderXXI
React.JS/FrontEnd engineer
Когда плоды/листья утрачивают связь с деревом, дерево трясут - плоды падают, дерево остается...

Любой код можно представить в виде дерева вызовов.

В бандл попадает код (например части библиотек/пакетов), который никак не связан с полезным кодом, занимает место но никогда не вызывается, таким образом с деревом кода не связан. Tree shaking помогает устранить такой код, оставив в бандле только то, что реально работает.

Вот например ты потянул здоровенную библиотеку в проект ради пару-тройки функций, а остальные дцать мегабайт просто лежат и вообще ничего не делают. Вот tree shaking, по идее, при сборке бандла эти мегабайты отбросит, оставит только то, что реально вызывается и приносит пользу...
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@RidgeA
если бы я считал что перевод подобных терминов хорошая идея, я бы перевел как "утряска дерева [AST]"...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы