5 причин, почему фронтенд такой сложный

Автор статьи Jordan Brennan

Низкий барьер для входа в frontend разработку (HTML, CSS и JavaScript) заставляет казаться её простой, но на самом деле с frontendo'м больших веб-приложениями очень сложно работать. Многие разработчики получают травмы в процессе и возвращаются к другим проектам, где у них меньше шансов ошибиться в структуре.

Итак, вот 5 характеристик внешнего интерфейса, которые делают его таким сложным:

1. Неконтролируемые отклонения во время выполнения

Код, который вы пишете, будет выполняться в среде браузера, которую вы не можете контролировать, и эти среды бывают дюжины вариантов, да ещё и на разных устройствах атрибуты HTML-тегов будут вести себя по-разному.

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

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

2. Сбои в работе сети - это нормально.

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

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

3. Пользователи могут делать что угодно в любое время.

Внешние проекты могут показаться почти такими, как будто они должны решать бесконечные сценарии:

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

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

4. Визуальная реализация

Это часть, вырисовывающая пиксели, называемая HTML-вёрсткой.

Нынешние проекты стали сложнее чем когда-либо, из-за достижений веб-платформы, скорости мобильных сетей и разнообразия устройств. В качестве примера возьмем размер экрана компьютера. Лет 20 назад все работали на экранах размером 800x600. Сегодня экран такого размера у всех в кармане. У нас есть все, от маленьких телефонов до больших профессиональных дисплеев 6k.

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

5. Асинхронная обработка

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

Источник: https://dev.to/jfbrennan/5-reasons-why-front-end-is-so-hard-2b92