Быстрое небольшое введение в React 16.0.

Наконец-то Facebook анонсировал React 16.0.

В React v16.0 внесены некоторые существенные изменения и обновлен алгоритм ядра реакции. В React v16.0 Facebook полностью пересмотрел внутреннее устройство React, сохранив при этом общедоступный API практически таким же.

Краткое введение в изменения:

Новая основная архитектура:

React 16 - первая версия React, построенная на новой базовой архитектуре, которая называется Fiber. Новые функции в React v16.0, т. Е. границы ошибок, фрагменты, порталы и асинхронный рендеринг (который предназначен для скоро будет выпущен) стали возможными благодаря Fiber.
Если вы хотите узнать больше об этой новой архитектуре, вот ссылка.

Фрагменты и строки:

Благодаря этой новой функции в React v16.0 теперь мы также можем возвращать массив элементов и строку из метода рендеринга компонента.

Ниже приведены примеры для массива и строки соответственно.

Обработка ошибок:

До React v16.0 любая ошибка в любой части пользовательского интерфейса приводила к сбою всего приложения. Для решения этой проблемы в React v16.0 была введена новая концепция, а именно Граница ошибок.

Границами ошибки могут быть только компоненты класса. Чтобы сделать компонент класса границей ошибки, мы определяем новый метод жизненного цикла под названием componentDidCatch (error, info).

Теперь вы можете использовать эту границу ошибок как обычный компонент.

Если вас интересует скринкаст, Я вас понял.

Порталы:

Благодаря этой новой концепции порталов React v16.0 позволяет нам отображать дочерние элементы в любом узле DOM, независимо от его расположения в DOM.

Щелкните здесь, чтобы узнать больше о порталах.

Обработка на стороне сервера:

React v16.0 включает полностью переписанный серверный рендерер. Это действительно быстро. Он поддерживает потоковую передачу, поэтому вы можете быстрее отправлять байты клиенту. Я не очень разбираюсь в рендеринге на стороне сервера, но могу отослать вас к этой замечательной статье для более глубокого введения в рендеринг на стороне сервера в React v16.0.
Вот Ссылка.

Уменьшенный размер файла:

Несмотря на все эти дополнения, React v16.0 на самом деле меньше по сравнению с 15.6.1!

  • react составляет 5,3 КБ (2,2 КБ в сжатом виде), по сравнению с 20,7 КБ (6,9 КБ в сжатом виде).
  • react-dom составляет 103,7 КБ (32,6 КБ в сжатом виде), меньше 141 КБ (42,9 КБ в сжатом виде).
  • react + react-dom составляет 109 КБ (34,8 КБ в сжатом виде), по сравнению с 161,7 КБ (49,8 КБ в сжатом виде).

Это составляет в совокупности уменьшение размера на 32% по сравнению с предыдущей версией (30% после сжатия gzip).

Лицензия MIT:

React v16.0 доступен по лицензии MIT. Они также опубликовали React 15.6.2 в Массачусетском технологическом институте.