Какие основные проблемы встречаются во frontend-разработке?

Э, слушай, вот сидишь ты такой, верстаешь, думаешь — ну что может пойти не так? А потом, блядь, начинается цирк, ёпта!

Первое, что вгоняет в ступор — это кроссбраузерность. Ну вот представь: в Хроме всё летает, красиво, а открываешь в каком-нибудь старом Сафари — и пиздец, всё разъехалось, как пьяные моряки в порту. Типа, свойство gap для Flexbox — вроде бы элементарщина, а этот фруктовый браузер его годами не понимал, будто ему в мозги насрали. Спасаешься префиксами, полифилами, постоянно гоняешь по «Can I Use» — а терпения-то, блядь, ноль ебать!

Дальше — производительность. Заходишь на сайт, а он грузится, будто через хуй с горы. Анимации дёргаются, скролл лагает, а в памяти утечки, как из дырявого ведра. Самый классический косяк — навесил кучу addEventListener, а удалять забыл. Компонент умер, а слушатели живут, как призраки, и жрут память. Решение? Ленивая загрузка, картинки оптимизировать, за памятью следить — в общем, работа не для ленивых.

Адаптивность — это отдельный вид искусства, или, скорее, ебля с микросхемами. Сверстал на большом мониторе — красота. Открыл на телефоне — а там всё в одну колонку съехало, кнопки размером с муравья, и ты уже чувствуешь себя полупидором, который не предусмотрел медиа-запросы. Спасает подход mobile-first, CSS Grid с Flexbox — но и тут надо голову включать, а не просто так, на авось.

Управление состоянием — вот где начинается настоящий пиздец, особенно в большом приложении. Один компонент что-то меняет, другому надо об этом узнать, третий вообще в другом углу живёт. Без стейт-менеджера типа Redux или MobX можно с ума сойти, как мартышка на банановой плантации. Хотя и с ними иногда так накрутишь, что сам от себя охуеешь.

Безопасность — это про то, чтобы тебе не вломили через XSS. Допустим, ты доверчивый, как хитрая жопа, и вставляешь пользовательский ввод прямо через innerHTML:

element.innerHTML = userInput; // Потенциальный XSS

А там, блядь, скрипт зловредный. И всё — твоему приложению пизда. Надо санитизировать всё, что летит от пользователя, или использовать textContent. Не доверяй никому, доверия — ебать ноль.

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

Тестирование — это вообще отдельная песня. Как покрыть все эти состояния: загрузка, ошибки, пустые данные? Пишешь unit-тесты, integration, ещё и E2E на Cypress'е гоняешь. Иногда кажется, что тестов больше, чем самого кода. Но без них — волнение ебать, выкатишь в прод и там всё посыпется.

И наконец, race conditions и асинхронность. Отправил два запроса параллельно, а они пришли в разном порядке, и состояние приложения поехало, как угарный мудак. Надо использовать AbortController для отмены, флаги выставлять, с промисами аккуратно работать. А то получится, что данные старые поверх новых легли — и привет, debugging до утра.

Вот так вот, блядь. Фронтенд — это не только про красивые кнопочки, это про то, чтобы всё это хозяйство не развалилось при первом же чихе. Держись там, и да пребудет с тобой сила... и терпения побольше, а то его, как обычно, ноль ебать.