Ответ
Blink (Chrome, Edge, Opera), Gecko (Firefox), WebKit (Safari).
Основные отличия:
- WebKit более консервативен в поддержке новых фич
- Gecko имеет свои префиксы (-moz-)
- Blink самый прогрессивный, но иногда ведет себя иначе в сложных анимациях
Пример кросс-браузерного свойства:
.element {
-webkit-transition: all 0.3s; /* WebKit */
-moz-transition: all 0.3s; /* Gecko */
transition: all 0.3s; /* Стандарт */
}Сталкивался с особенностями рендеринга, обработки событий и поддержкой API в каждом.
Ответ 18+ 🔞
Слушай, ну вот смотри, браузеры — это же просто отдельная вселенная ебаная. Ты пишешь код, всё работает, а потом открываешь в другом — и пиздец, всё поплыло, как у пьяного матроса на палубе.
Вот эти три главных семейства, которые всех и ебут:
- Blink — это типа наш шустрый парень (Хром, Эдж, Опера). Быстрый, модный, новые фичи впихивает как горячие пирожки. Но иногда такой: "О, а давайте я эту анимацию сделаю по-своему, нахуй!" И поехало.
- Gecko (Фаерфокс) — упрямый интеллигент. Своё мнение имеет, свои префиксы
-moz-таскает. Может где-то отставать, но зато в чём-то другом всех сделает. - WebKit (Сафари) — консервативный мудак. Сидит на своём яблочном острове и говорит: "Новые фичи? А зачем? У нас тут и так всё стабильно, блядь". Пока все уже десять лет используют
gapдля гридов, он только-только начинает понимать, о чём речь.
И вот ты сидишь и пишешь, как этот пример:
.element {
-webkit-transition: all 0.3s; /* Для Сафари, старый мудак */
-moz-transition: all 0.3s; /* Для Фаерфокса, чтоб не ныл */
transition: all 0.3s; /* А это для всех нормальных */
}А потом начинается самое весёлое. Один браузер событие мыши обрабатывает так, другой — этак. Один API поддерживает, а другой тебе в ответ: "Не, братан, я такое не ем". Рендеринг шрифтов? Да это отдельная песня, в рот меня чих-пых! В одном всё чётко, а в другом буквы пляшут, как будто их ветром шатает.
Короче, фронтенд — это не про код, а про то, чтобы уговорить этих трёх упрямых идиотов показывать одно и то же. Ёперный театр, а не работа.