Перезапись CSS и выборочная загрузка CSS с помощью Modernizer (YepNope)

Question

Не знаете, как это проверить, но есть ли какой-либо выигрыш в производительности при загрузке в таблицу стилей CSS с помощью запроса с Modernizer.load, в отличие от простого перезаписи правила с именем класса CSS в той же таблице стилей.

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

{
  test: Modernizr.touch,
  yep : 'css/touch.css',
  nope: 'css/base.css'
}

Или переписать стили в той же таблице стилей...

.container { width: 50% }

.touch .container { width: 100% }

Кажется, разница сводится к скорости дополнительного запроса и весу одного большого файла CSS?

Answer 1

Вы должны понимать, что у вас есть 3 детали здесь.

1. звонок на сервер.

2. время браузера для расчета всех ваших родительских стилей

3. вес файлов.

так что ответ.

если вы напишите css без разрыва строки между свойством, 1 большой файл будет больше из 2 файлов. и лучше ответ на файл весовой причины 1.

если у вас есть целая страница, которую нужно сделать с классом.touch, лучше рассчитать, чтобы пришел файл с классами.

Итак, я делаю, чтобы вызвать сервер только один раз и сделать один файл, потому что лучше загрузить все стили вместе, и вызов на сервер (важное значение времени) будет в ближайшее время

Answer 2

Я думаю, что оба варианта совершенно верны.

Если существует большой объем CSS-кода, специфичного для сенсорного ввода, я бы сказал, да, используйте его с Modernizr, чтобы избежать дополнительной нагрузки на несенсорные браузеры.

Тем не менее, я бы предпочел использовать стили переопределения для такого рода вещей.

Причина этого в том, что с опцией Modernizr вы будете откладывать загрузку сенсорных стилей, потому что он не может выполнить тест Modernizr, пока скрипт Modernizr не будет загружен и готов к запуску.

Таким образом, по сравнению с загрузкой как части загрузки главной страницы и готовностью к начальному отображению, она загружается только после загрузки страницы и может быть не готова сразу.

Результатом этого может быть то, что страница может быть загружена и отображена до загрузки сенсорных стилей. Не идеально.

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