Обложка канала

Frontender's notes

Годные заметки, новости, видео и интересные статьи для Frontend разработчиков.

Frontender's notes

3 года назад
Открыть в
​​Алоха товарищи фронты! С недавних пор я на работе перешел на новый проект в котором никогда не было постоянного фронта, а только время от времени брали кого-то на времянку для решения тех или иных задач. В итоге ожидаемо проект оказался сборной солянкой где никто особо не заботился ни о нормальной архитектуре не о производительности. Кому разгребать? Видимо мне :) В общем все это меня подтолкнуло на мысль что вам возможно будет интересно если я буду рассказывать о каких-нибудь своих действиях или идеях и к чему они приводят. Может чего полезного наговорю. Ну так вот, при разборе кода первое на что я наткнулся это не правильно продуманные useMemo и useCallback. Их идея в том что бы определенные функции пересоздавались при рендере только в том случае если меняются переменные которые в этом коде используются. А на практике была куча вот таких вещей: const func = useMemo(() => { const a = propB * stateA; return a; }, [propA, propB, propC, stateA, stateB]) Это просто элементарный пример и как видите мемоизированная функция будет перерисовываться при изменении даже тех переменных которые ей ну никак не нужны. А в моем случае это еще и куски кода размером до 400 строк еще и внутри с запросами... Когда я их разобрал компонент стал заметно быстрее рендериться а еще стало заметно меньше запросов. В общем не надо так делать... Если вам такие посты заходят то тыкните зеленую кнопочку плиз.