Какво ново в библиотеката на потребителския интерфейс на React JavaScript

Вече налична в производствена версия, Версия 16.8 на библиотеката на потребителския интерфейс на React JavaScript има възможността за куки, за използване на състояние и други функции на React, без да се налага да пишете клас.

Къде да изтеглите React

Можете да изтеглите продуктовата версия на React от GitHub.

Текуща версия: Нови функции в React 16.8

Издаден през февруари 2019 г., React 168 осигурява изпълнение на куки за React DOM, DOM сървър, тестово изобразяване и плитко изобразяване Куките се поддържат в React DevTools. Разработчиците могат да създадат свои собствени куки, за да споделят повторно използваема логика на състоянието между компонентите. Но Facebook съветва разработчиците да отделят време с тази възможност, като не препоръчват разработчиците да пренаписват приложения, за да използват куки „за една нощ“.

Няма планове за премахване на класове от React, така че разработчиците трябва да изпробват куки в някои нови компоненти. Кодовете, използващи усредняващи куки, ще работят заедно със съществуващите кодове, използващи класове.

Предишна версия: Нови функции в React 16.7

Издаден през декември 2018 г., React 16.7 добавя възможността за куки за използване на състояние и други функции на React, без да пише клас.

Куките са функции, които се свързват с React състоянието и характеристиките на жизнения цикъл от функционалните компоненти. В момента те работят рамо до рамо със съществуващия код, което позволява постепенно приемане. Няма планове за действително премахване на класове от React. Куките решават различни проблеми в React, включително:

  • Липсата на начин за прикрепване на поведение за многократна употреба към компонент. Има модели като рендериращи реквизити и компоненти от по-висок ред, които се опитват да решат това, но те изискват преструктуриране на компоненти, което може да бъде тромаво и да затрудни следването на кода. Използвайки куки, разработчиците могат да извлекат логика на състоянието от компонент за независимо тестване и повторно използване.
  • Сложните компоненти станаха твърде трудни за разбиране. С куки компонентите могат да бъдат разделени на по-малки функции въз основа на свързани части, като например настройване на абонамент или извличане на данни. Това се прави, вместо да се налага разделяне на базата на методите на жизнения цикъл.
  • Класовете могат да объркат както хората, така и машините и се разглеждат като най-голямата бариера пред изучаването на React. Куките позволяват на разработчиците да използват повече от функциите на React без класове. Куките обхващат функции, но без да жертват духа на React. Осигурен е достъп до императивни аварийни люкове. Разработчиците не трябва да учат сложни техники за функционално или реактивно програмиране.

Предишна версия: Нови функции в React 16.6

Издаден през октомври 2018 г., React 16.6 предлага няколко подобрения.

  • С memoтова, разработчиците могат да скачам с парашут от оказване с функционални компоненти, подобно на компоненти клас може да скачам от рендиране, когато входните подпори са същите като се използва PureComponentsили shouldComponentUpdate.
  • С lazy, разработчиците могат да използват Suspenseкомпонента за разделяне на кода чрез обвиване на динамичен импорт в извикване React.lazy(). Забележка: Функцията все още не е налична за визуализиране от страна на сървъра.
  • API за удобство е въведен за консумиране на контекстна стойност от компонента на класа. Разработчиците се оплакаха, че приемането на новия API на render prop от React 16.3 може да бъде трудно в компонентите на класа.
  • Метод на грешка getDerivedStatefromError(), рендери резервния потребителски интерфейс преди завършването на изобразяването. Забележка: Той все още не е достъпен за визуализиране от страна на сървъра, но разработчиците могат да започнат да се подготвят за него.
  • Два StrictmodeAPI са оттеглени: findDOMNode()и наследствен контекст, използващ contextType и getChildContext. Разработчиците се насърчават да надстроят до новия contextTypeAPI.

Предишна версия: Нови функции в React 16.4

Версия 16.4 на React, пусната в края на май 2018 г., добавя поддръжка за събития с указатели, често искана функция, както и подобрение за предстоящата възможност за асинхронно изобразяване. Браузърите, които поддържат указателни събития, включват версии на Google Chrome, Mozilla Firefox, Microsoft Edge и Microsoft Internet Explorer.

Събития на показалеца са DOM събития, изстреляни за посочващо устройство, предназначени да осигурят единичен модел на събитие за обработка на устройства като мишка или докосване.

С поддръжката на указателни събития React добавя поддръжка за типове събития, които включват:

  • onPointerDow
  • onPointerMove
  • onPointerUp
  • onPointerCancel
  • onGotPointerCapture
  • onLostPointerCapture
  • onPointerEnter
  • onPointerLeave
  • onPointerOver
  • onPointerOut

Други нови възможности в React 16.4 включват:

  • Подобрена съвместимост с планиран асинхронен режим на изобразяване. За да направите това, изданието включва корекция на грешка getDerivedStatefromProps, която сега се извиква всеки път, когато е необходим компонент, независимо защо се случва актуализацията. Той е бил извикан само ако компонент е бил изобразен от родител и няма да се задейства в резултат на локален setState. Поправката не засяга повечето приложения, но в редки случаи може да причини проблеми с малък брой компоненти.
  • Добавен е експериментален компонент за профилиране, наречен unstable_Profiler, за измерване на производителността.
  • Експериментален помирител, за създаване на персонализирани визуализатори, предлага нова конфигурационна форма на хост, която е плоска и не използва вложени обекти.
  • Поправките на React DOM включват поправяне на грешка, която предотвратява разпространението на контекста в някои случаи, както и ситуация, при която някои атрибути са били неправилно премахнати от възли на персонализирани елементи.

Възможността за експериментално връщане на повиквания беше изтрита в React Версия 16.4, защото засягаше размера на пакета и API не беше достатъчно добър. Очаквайте го в някакъв момент под друга форма, казва Facebook.

Предишна версия: Нови функции в React 16.3

Пускането на React от март 2018 г. версия 16.3 носи промени в жизнения цикъл, както и API за контекст.

Промени в жизнения цикъл в React 16.3

За жизнения цикъл на компонента, предстоящият режим на асинхронно изобразяване разтяга модела на API на компонента на класа, който се използва по начини, които първоначално не са били предвидени. Така че се добавят нови жизнени цикли, включително getDerivedStateFromPropsкато по-безопасна алтернатива на наследения жизнен цикъл componentWillReceiveProps,. Също така е добавено getSnapshotBeforeUpdate, за да се поддържа безопасно четене на свойства, като DOM, преди да бъдат направени актуализации.

React 16.3 също добавя „небезопасен“ префикс към някои от тези жизнени цикли, като например към componentWillMountи componentWillReceiveUpdate. В тези случаи „небезопасен“ не се отнася до сигурността, а до факта, че кодът, използващ тези жизнен цикъл, е по-вероятно да има грешки в бъдещите версии на React.

С изданието React 16.3 разработчиците не трябва да правят нищо по отношение на наследените методи. Изданието е предназначено да подкани поддържащите проекти с отворен код да актуализират своите библиотеки преди предупрежденията за оттегляне, които няма да бъдат активирани до бъдещо издание в реда 16.x.

Версия 16.3 добавя StrictModeкомпонента, който идентифицира компоненти с опасни жизнен цикъл. StrictMode, който работи само в режим на разработка, също предупреждава за използването на API за наследствен низ и открива неочаквани странични ефекти. Той активира допълнителни проверки за потомци. Повече функционалност ще бъде добавена по-късно.

API за контекст поддържа статична проверка на типа и дълбоки актуализации

Новият контекстен API, поддържа статична проверка на типа и дълбоки актуализации. Този API също е по-ефективен от предишната експериментална версия на API, каза Брайън Вон, член на основния екип на React JS във Facebook. Контекстът позволява данните да се предават през дърво на компоненти, без да се налага ръчно предаване на подпори, някои от които включват предпочитание за локал и тема на потребителския интерфейс. Старият API ще продължи да работи за версии на React 16.x, като дава време на потребителите да мигрират.

Също така ново в React 16.3:

  • Подобрен API, наречен createrefAPIза управление на референции, които осигуряват начин за достъп до DOM възли или React елементи, разработени в метода за рендиране.
  • В forwardRefAPI, което помага с използването на компоненти от висок порядък, които насърчават код повторна употреба.

Предишна версия: Нови функции в React 16.2

Пускането на React 16.2 от ноември 2017 г. дава възможност на фрагментите да подобрят поддръжката за показване на множество деца от метод за визуализиране на компоненти. Фрагменти, които приличат на празни JSX тагове, позволяват на разработчиците да групират списък с деца, без да добавят възли към DOM.

Можете да инсталирате Версия 16.2 от регистъра на NPM. За да инсталирате с мениджъра на пакети за прежди, стартирайте yarn add [email protected]^16.2.0 [email protected]^16.2.0. За да го инсталирате с NPM, стартирайте npm install --save [email protected]^16.2.0 [email protected]^16.2.0.

Предишна версия: Нови функции в React 16.0

Наречен „React Fiber“ по време на разработката си, React 16.0 от септември 2017 г. е пренаписване на ядрото на React, подобряващо възприеманата реакция на сложни приложения чрез нов алгоритъм за съгласуване. Основните характеристики на React 16 включват:

  • Грешки, които съдържат проследяване на стека на компоненти, за да ги улесни за отстраняване на грешки.
  • Връщане на низове / масиви директно от методи за рендиране на компоненти.
  • Нов по-бърз, рендеринг от страна на сървъра.
  • По-голяма производителност на приложения, подобни на естествени
  • Преминаването от спорния лиценз за BSD + патенти към по-вкусния лиценз за MIT.

Въпреки че вътрешните елементи на React са напълно пренаписани в React 16, публичният API е „по същество непроменен“, казва Софи Алперт, инженерен мениджър на Facebook за React. Целта беше да се спести на разработчиците от необходимостта да пренаписват съществуващи компоненти, изградени с React.

Новият код на React 16 е написан заедно със стар код в репозитория на GitHub, според позната практика във Facebook. Превключванията между двете бяха направени с булев useFiberфлаг на характеристиките. Процесът позволи на Facebook да започне да изгражда новата си реализация, без да засяга съществуващите потребители и да продължи да прави корекции на грешки в старата кодова база.

След няколко месеца изглаждане на грешки, Facebook избра да достави един продукт, за да намали възможния набор от грешки, вместо да поддържа две версии на React актуални.