Верстка, CSS, HTML, SVG
Что быстрее подгружается margin или gap?
Может margin более оптимизирован поэтому он быстрее? Допустим если сделать 1000 gap и 1000 margin что быстрее вычислиться и примениться?
С margin всё непросто: схлопывание вертикальных отступов требует учитывать и отступы соседних элементов, и отступы родителей / потомков.
https://webref.ru/course/block-model/margin-collapse
Gap позволяет проще и удобнее задавать промежутки между блоками - не заморачиваясь схлопыванием, отрицательными margin для компенсации отступов у краёв контейнера и прочими костылями.
Даже если margin быстрее, разницу в скорости отображения реальной страницы никто не заметит: основное время уходит на получение данных с сервера, а отрисовка каркаса страницы - это быстро. А уменьшение объёма CSS при замене margin на gap вполне может ускорить отображение страницы.
https://webref.ru/course/block-model/margin-collapse
Gap позволяет проще и удобнее задавать промежутки между блоками - не заморачиваясь схлопыванием, отрицательными margin для компенсации отступов у краёв контейнера и прочими костылями.
Даже если margin быстрее, разницу в скорости отображения реальной страницы никто не заметит: основное время уходит на получение данных с сервера, а отрисовка каркаса страницы - это быстро. А уменьшение объёма CSS при замене margin на gap вполне может ускорить отображение страницы.
Разницы нет. Потому что миллиардная доля секунды - это не разница.
Андрей Житников
В программирование важна точность, и даже доля секунды может очень многое решать
Чисто теоретически gap: кода меньше, задается один раз на уровне родителя, а не для каждого элемента, не нужно дополнительно обнулять отступ у последнего элемента, не нужно вычислять «схлопывания»
Но вопрос, на самом деле, глупый, т.к. на современных сайтах огромного размера изображения @2x и более, видео, кастомные шрифты и т.д. и т.п., поэтому в css нужно использовать 1 – современное решения, 2 – кроссбраузерное, 3 – максимально удобное, 4 – то, что решает вашу задачу и все, а не отказываться от чего-то только потому что вам кажется, что это имеет значение.
Вот правильный выбор селектора – важен, сокращать размер файла, тоже важно, а сравнивать скорость вычисления margin против gap не имеет никакого смысла – ни вы ни браузер этого не почувствуете.
Но вопрос, на самом деле, глупый, т.к. на современных сайтах огромного размера изображения @2x и более, видео, кастомные шрифты и т.д. и т.п., поэтому в css нужно использовать 1 – современное решения, 2 – кроссбраузерное, 3 – максимально удобное, 4 – то, что решает вашу задачу и все, а не отказываться от чего-то только потому что вам кажется, что это имеет значение.
Вот правильный выбор селектора – важен, сокращать размер файла, тоже важно, а сравнивать скорость вычисления margin против gap не имеет никакого смысла – ни вы ни браузер этого не почувствуете.
Андрей Житников
Почему же google и прочие крупные компании десятилетиями оптимизирует генерацию html структуры и скорости применения стилей, раз никто этого не чувствует?
Похожие вопросы
- Зачем для разделения в блоках используют margin, а не gap?
- В чем разница между padding и margin?
- HTML. Можно ли как-то мониторить если клиенту выводится атрибут alt вместо картинки, для быстрого устранения проблемы?
- Скажите, пожалуйста, чем отличается margin-left от вот такой записи: margin^0 0 0 35px;?
- как создать цикл для margin?
- Евросоюз готовит эмбарго на Российскую нефть. Всё больше подгружаемся в сценарий Ирана?
- когда в Москве откроется GAP?
- Помогите пожалуйста Read the email and complete it with the words that best fit the gaps. Use one word in each gap.
- Видео онлайн тормозит, идет рывками, медлено подгружается. Скорость 972кбит\с. Может из-за видеокарты? И виснет черн.экр