Компонент перерисовался. Почему? Пишем инструмент для Vue и трижды ломаем чужой прод
Habr ·
Есть Vue DevTools с галкой «Highlight updates». Есть react-scan в соседней экосистеме. Оба показывают одно и то же: вот этот компонент перерисовался. Проблема в том, что знание «перерисовался» само по себе бесполезно. Ты и так видишь, что страница дёргается. Вопрос всегда другой: что именно изменилось . Какой проп, какой реф, какое поле стора. Без этого ты сидишь и комментируешь куски шаблона, пока не найдёшь виновника методом половинного деления. В React иначе и нельзя: реактивность там на уровне «перерисовался компонент», причину приходится реконструировать диффом пропсов. А во Vue реактивность точечная — фреймворк знает, какая именно зависимость дёрнула рендер. И он её отдаёт. Читать далее
Есть Vue DevTools с галкой «Highlight updates». Есть react-scan в соседней экосистеме. Оба показывают одно и то же: вот этот компонент перерисовался. Проблема в том, что знание «перерисовался» само по себе бесполезно. Ты и так видишь, что страница дёргается. Вопрос всегда другой: что именно изменилось . Какой проп, какой реф, какое поле стора. Без этого ты сидишь и комментируешь куски шаблона, пока не найдёшь виновника методом половинного деления. В React иначе и нельзя: реактивность там на уровне «перерисовался компонент», причину приходится реконструировать диффом пропсов. А во Vue реактивность точечная — фреймворк знает, какая именно зависимость дёрнула рендер. И он её отдаёт. Читать далее