Главная » Архив меток: React

Архив меток: React

Как использовать React.lazy и Suspense для отложенной загрузки компонентов

От автора: React 16.6 вывел разделение кода на новый уровень. Теперь вы можете загружать компоненты, когда это действительно необходимо, без установки дополнительных библиотек. Что такое разделение кода и отложенная загрузка? Webpack определяет разделение кода как: «Метод разделения вашего кода на различные пакеты, которые затем могут быть загружены по требованию или параллельно». Другой способ сказать: «загрузка по требованию или параллельно» — ...

Читать далее »

Обзор свойств рендеринга в React

От автора: рендеринг в React — это метод эффективного повторного использования кода. Согласно документации React, «компонент со свойством рендеринга принимает функцию, которая возвращает элемент React и вызывает ее вместо реализации собственной логики визуализации». Чтобы понять, что это значит, давайте рассмотрим шаблон свойства рендеринга, а затем применим его в нескольких простых примерах. Шаблон свойства рендеринга При работе со свойствами рендеринга вы ...

Читать далее »

Плавная прокрутка в React: реализация

От автора: плавная прокрутка, не знаете, что это такое? Ну, вместо того, чтобы нажимать на кнопку и мгновенно перемещаться на другую часть (той же) страницы, пользователь перемещается туда с помощью анимации. Прокрутка в React – это одна из тех тонких особенностей сайта, которая создает невероятную разницу в плане эстетики. Я лично только что реализовал это на одном из своих сайтов, ...

Читать далее »

Отношения любовь-ненависть между React Router и React Components

От автора: как разработчикам React, большинству из нас нравится работать с React Router и нравится то, насколько хорошо он подходит для нашего приложения React. Почему мы любим React Router: Прекрасно работает с React и следует тем же принципам Навигационный аспект маршрутизатора очень просто понять Компонентный состав, декларативный пользовательский интерфейс, управление состояниями и то, насколько он следует основному потоку React (событие ...

Читать далее »

5 вещей, которые я не знала о Create React App

От автора: Create React App — это инструмент, который упрощает создание приложений React без необходимости иметь дело со сложными настройками. Недавняя версия Create React App v2 — отличный повод, чтобы пройтись по Руководству для пользователей еще раз и найти интересные функции, о которых вы не знали. Вот те, о которых не знала я. 1. Отображение линтов ошибок в редакторе Я ...

Читать далее »

Хуки React: это не магия, это просто массивы

От автора: я большой поклонник нового API хуков. Тем не менее, у него есть некоторые странные ограничения относительно того, как вам следует его использовать. Здесь я опишу модель, с помощью которой те, кто пытается понять причины этих правил, могут представить себе, как именно используются в React хуки. ПРЕДУПРЕЖДЕНИЕ: API хуков является экспериментальной функцией Эта статья посвящена API хуков, который в ...

Читать далее »

Разрушение производительности приложения React через Redux

От автора: если разработать с помощью React Redux приложение, то это упрощает управление состояниями React. Но если Redux не интегрирован правильно, это может нивелировать ключевые преимущества использования React, разрушая производительность. В этом посте описывается, как вышло так, что я создал приложение с медленными показателями, и какие шаги я предпринял для исправления ситуации. Нашей команде было поручено создать инструмент, позволяющий пользователям ...

Читать далее »

React 16.6: React.memo() для управление рендерингом функциональных компонентов

От автора: React 16.6.0 вышел! В нем появилось множество новых функций, включая две основных: React memo () и React.lazy(). Разделение кода и отложенная загрузка с помощью React Suspense. В этой статье мы рассмотрим React.memo(), а React.lazy() и Suspense в следующей крупной статье. Что такое React.memo()? React.memo() похож на PureComponent в том, что он помогает контролировать, когда наши компоненты будут перезагружаться. ...

Читать далее »

Если вы пренебрежете основами React, это может вас погубить

От автора: часто неспособность отладить какую-то ошибку проистекает из того, что вы не понимаете определенную основополагающую концепцию. Аналогично вы можете не понимать более продвинутые концепции, потому что вам не хватает знаний об определенных базовых принципах. В этой статье я надеюсь объяснить то, что я считаю наиболее важными основополагающими принципами React, которые вам нужно понять. Эти React основы не являются чисто ...

Читать далее »

Создание виджета автозаполнения с помощью React и Elastic Search

От автора: этот пост представляет собой компиляцию утвержденных технических решений, применяемых благодаря React и Elastic Search и связанных с созданием виджета поиска с использованием автозаполнения со следующими требованиями ниже. Создать панель поиска для быстрого нахождения клиента по имени или фамилии или по уникальному короткому коду. Он должен поддерживаться поиск по принципу «поступательный-набор» с уточнением результатов при нажатии новых клавиш Поиск ...

Читать далее »