Pull to refresh
13
0
Send message

Как вырваться из матрицы? Мнение программиста

Level of difficultyEasy
Reading time8 min
Views16K

Некоторое время назад возмутил Хабр статьей про то, что убежден - мы находимся в симуляции. Было много как позитивных, так и негативных отзывов. Статью даже пытались заблокировать, (возможно, из-за вмешательства «администраторов Матрицы»), вторую часть, так и не пропустили.

Было много вопросов, в чем смысл симуляции, если она действительно существует. Другими словами, в чем смысл жизни? Позволю себе посветить в определенную сторону, на то, что уже на виду, на то, что уже происходит. Как мне кажется, мы с вами на пороге создания собственной симуляции. Может не с технической точки зрения, но запрос на создание симуляции уже витает в воздухе.

Читать далее

File upload на React.js шаг за шагом

Level of difficultyMedium
Reading time18 min
Views26K

В этой статье напишем компонент для загрузки файлов на сервер, который поддерживает:

Индикатор загрузки

Прерывание отправки

Drag and drop

В нашей конкретной реализации этот компонент будет оберткой и сам не будет отображать файлы, но, я надеюсь, приемы из этой статьи помогут написать свой компонент, и если вам понадобится сделать в нем отображение - легко справитесь. При наведении на обернутый компонент, будь это картинка, специальное поле, поле с текстом или все что угодно, поверх этого всего что угодно появится перекрытие со значком загрузки, что даст пользователю понять - здесь можно отправить картинку. По этой причине использование обертки оправдано.

Читать далее

useCallback в цикле? Мемоизация коллбеков для компонентов в массиве

Level of difficultyEasy
Reading time12 min
Views3.8K

Приветствую, коллега! В нашей практике порой возникают ситуации, когда нужно создать список инпутов. Например, создаем инпут для фильтра по строкам. Должна быть возможность добавлять инпут, удалять существующие. Классические оптимизации тут не сработают, даже если будем использовать memo и useCallback, все равно все инпуты будут обновляться при каждом обновлении родителя. В этой статье разберем, как оптимизировать списки инптов, разберем 2 способа мемоизации колбеков, благодаря которым будет изменяться единственный инпут в массиве, а не все. Будем использование кеширование и паттерн event switch. Поехали!

Читать далее

Мы живем в компьютерной симуляции. Мнение программиста (2024)

Level of difficultyMedium
Reading time22 min
Views44K

Меня зовут Игорь Звягин, я профессиональный веб-разработчик, в этой статье я хочу рассказать, как пришел к мнению, что мы живем в компьютерной симуляции, почему это не тревожит и какие интересные возможности это предоставляет.

В этой статье:

Поговорим про эксперимент с двумя щелями (оптимизация вычислений) и этот же эксперимент с отложенными выбором (нарушение причинно-следственных связей, изменение прошлого). Существующие объяснения эффекта наблюдателя способны объяснить лишь первые версии эксперимента, но абсолютно бессильны перед вариацией эксперимента с квантовым ластиком и отложенной обратной связью.

Обсудим квантовую запутанность (оптимизация вычислений).

Поговорим про Парадокс теории вероятностей – игра Пенни. В нашей реальности не существует независимых событий, что может говорить о том, что все случайности созданы благодаря псевдослучайным числам. Приведу код, который вы сможете запустить у себя на компьютере, запросить реальные случайные числа и проверить, насколько предсказательная формула оказалась близка к реальности.

Обсудим возможность существования мультивселенной и параллельных миров.

Также поговорим про эффект Манделы и Ложные воспоминания, что поговорит о том, что прошлое можно менять при определенных условиях.

Читать далее

React useReducer, зачем нужен и как использовать

Level of difficultyMedium
Reading time7 min
Views25K

useReducer - это хук для работы с состоянием компонента. Он используется под капотом у хука useState. В этой статье разберемся с api useReducer, когда лучше использовать useReducer вместо useState и поговорим про нестандартный случай использования useReducer.

Читать далее

Все что необходимо знать про key в React и даже больше

Level of difficultyEasy
Reading time6 min
Views11K

В этой статье мы поговорим о ключах (key) в React, разберемся зачем они нужны, как работает компонент при изменении ключа, и обсудим случаи, когда использование ключей вне массива или использование индексов в качестве ключей может быть даже лучше, чем уникальные значения.

Читать далее

React hooks, как не выстрелить себе в ноги. Разбираемся с замыканиями. Совместное использование хуков

Reading time7 min
Views12K

По отдельности хуки могут быть относительно понятны, но у многих возникают вопросы, как их использовать вместе. Особенно часто возникают подобные вопросы при переходе от классовых компонентов к функциональным. В этой статье мы разберем несколько случаев:

Как работать с запросами в useEffect

Как предотвращать лишние запросы в useEffect с помощью useRef и использовать useRef как стабильную переменную

Уже этих примеров будет достаточно для многих прочих случаев. Главное обсудим, как ведет себя замыкание в хуках, почему именно так, и почему useRef работает как стабильная переменная.

Читать далее

React hooks, как не выстрелить себе в ноги. Часть 4

Reading time13 min
Views20K

Использование ref в функциональных компонентах играет две роли:

1. С помощью них можно получить ссылку на dom элементы и react компоненты

2. ref можно использовать как стабильные переменные.

В этой статье сосредоточимся на первой роли, разберем, как с помощью ref получить доступ к dom элементам и компонентам react, включая такие какие способы как createRef, useRef и ref callback. Обсудим для чего нужны forwardRef и useImperativeHandle , и как с их помощью получить ссылку на функциональные компоненты, спойлер: нельзя так просто получить ссылку на функциональный компонент с помощью ref. А уже в следующей статье обсудим роль ref в качестве стабильной переменной, и как это облегчит нам жизнь при использовании useEffect, useMemo, useCallback.

Читать далее

React hooks, как не выстрелить себе в ноги. Часть 3.2: useMemo, useCallback

Reading time12 min
Views52K

Данная статья продолжение статьи про мемоизацию, в которой мы разбирали зачем нужно использовать memo и как правильно с ним работать. В этой статье разберем, как правильно использовать useMemo и useCallback, какое у них api и разберем пару трюков. В прошлой статье я писал, что в следующей будет информация про useRef, useImperativeHandle и прочее, но в итоге решил, что текущий материал можно объяснить проще. Только трюки подведут нас к использованию useRef и уже в следующей лекции мы разберемся с ним.

Читать далее

React hooks, как не выстрелить себе в ноги. Часть 3.1: мемоизация, memo

Reading time7 min
Views19K

Статья про мемоизацию оказалась объёмной и включает в себя разбор hoc memo, хуки useMemo и useCallback, затрагивает тему useRef. Было принято решение разбить статью на 2 части, в первой части разберем когда нужно и когда ненужно использовать memo, какое у него api, какие проблемы решает. Во второй части разберем хуки useMemo, useCallback, а также некоторые проблемы этих хуков, которые можно решить с помощью useRef.

В прошлых статьях мы разбирали как работать с useState и с useEffect. Знаем: код компонента будет выполняться каждый раз при его обновлении. Отсюда возникает проблема - данные и сложные вычисления будут теряться, также будет происходить лишнее обновление дочерних компонентов. Эти проблемы решает хук useMemo и обертка над ним useCallback, но оба работают в связке с memo hoc.

Читать далее

React hooks, как не выстрелить себе в ноги. Часть 2: useEffect и useLayoutEffect

Reading time10 min
Views48K

В этой статье разберем как с помощью useEffect воспроизвести методы жизненного цикла в функциональных компонентах. Поговорим как и когда использовать useEffect и useLayoutEffect. Обсудим особенности отправки запросов из useEffect. Также узнаем почему массив зависимостей необязателен и когда это может пригодиться.

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

Читать далее

React hooks, как не выстрелить себе в ноги. Часть 1: работа с состоянием

Reading time8 min
Views48K

Статья поможет новичкам понять как работать с хуками, а также будет полезна и опытным разработчикам. Этой статьей открываю серию статей про хуки.

Использование хуков с одной стороны позволяет использовать методы жизненного цикла в функциональных компонентах и призваны улучшать производительность, что делает функциональные компоненты полноценным конкурентом классовых компонентов. С другой стороны, неправильное использование хуков приводит к лишним операциям и может свести на нет все преимущества функциональных компонентов.
В этой серии статей разберем основные хуки реакта и как их правильно использовать.

Читать далее

Information

Rating
Does not participate
Registered
Activity