Или как отличить ИИ-нормальный код от ИИ-ненормального.
Я проверил 20 последних сайтов в МОТ. По статистике:
⚪️41% – используют чужие модификации
⚪️ 20% – пишут свой код (как правило, css из девтулза Chrome, но бывают и редкие скрипты)
⚪️39% – используют код, написанный ИИ
Представляете, больше трети кода для Тильды пишется с помощью искусственного интеллекта. Который уже (ну почти) догнал модификации, а по объёму сгенерированного кода, я думаю, перегнал.
И всё работает, казалось бы, достаточно неплохо. И уже не разваливается после смены контекста. Но если заглянуть внутрь, окажется, что это не потому, что там хороший код, а потому что нейросети нас обхитрили)
Они взяли и сгенерировали код, который работает в 99,9% случаев. На Тильде, на Вордпрессе, на next.js, и даже на луне) То есть буквально: какая бы ситуация ни случилась, ИИ учитывает этот случай. Проблема в том, какой ценой.
Так вот. Если вы увидите эти маркеры в коде, который вам выдаёт ИИ – знайте, это потенциально ред флаг⛔️
#1. setInterval для запуска кодаСама по себе функция безобидная, но ИИ её использует в своих корыстных целях. Суть в том, что каждые N миллисекунд скрипт вызывает функцию, пока не сработает определенное условие. В контексте Тильды ИИ использует её для того, чтобы найти нужный элемент, тк он не всегда появляется при загрузке страницы.
Почему это плохо?
Потому что до появления элемента скрипт может выполниться хоть тысячу раз впустую. Если в теле функции находится что-то объёмное – например, сложные вычисления, то страница может в принципе зависать.
#2. MutationObserver на всей страницеЭто такая функция, которая следит за изменениями на странице. Например, что там добавился или удалился какой-то элемент. И запускает код при наличии этих изменений. Ситуация похожа на интервальный поллинг, но только проблема тут чуть другая)
Здесь функция выполняется столько раз, сколько изменений произошло. Обычно обсервер вешается на родительский элемент, но ИИ про него не знает и ставит сразу на всю страницу, из-за чего функция срабатывает столько раз, сколько изменений произойдет с момента её запуска. Например, тысячу)
Страница с 10 такими скриптами ощутимо просядет, особенно на слабых устойствах.
#3. Вставка инлайн-стилей через Javascript
Иизощрение на ровном месте, когда можно просто написать css и вставить его на страницу, обернув в
<style>. Вместо этого ИИ ищет элементы и по одному присваивает им нужные свойства. Чем больше элементов это затрагивает, тем это дороже: каждое присваивание заставляет браузер пересчитать и перерисовать то, что уже нарисовано предыдущими стилями...В принципе это – моветон в разработке, который используется только в крайних случаях, когда невозможно применить стили через CSS. Но так как ИИ всего контекста не видит, он принимает такое решение – чтобы точно и наверняка.
⚫️И вот ИИ нагенерил вам код, и он работает. У вас мощный макбук, вы проверили трижды – все четенько и сидите пьёте айс-латте с закрытым чеком. Пока Вася на своей мобиле с полутора палками 4G нервно пытается загрузить страницу, раздражается и уходит с сайта, так и не записавшись на курс по ИИ)
Шучу конечно, просто хочу сказать главное: важно не только то, что работает, но и как. Мы пока этого не замечаем, но с каждым непроверенным ИИ-решением копится техдолг. На моей памяти нейросеть смогла выдать хорошо построенное решение всего один раз – тогда был ещё Opus 4.6. Очень важно понимать, что ты строишь и как. Потому что знание – сила 🤍
ps. на скриншотах разобрал кусочки ИИ-кода из поста и как лучше делать вместо этого. Всё основано на реальных событиях
Максим Постников | Дизайн, Тильда и модификации