Как правильно подключить css с медиа-запросами?

Question

[Алексей Николаев]

Добрый вечер!
Есть responsive.css, в котором около 4-5 бреакпойнтов. Обычно я всегда подключал его в шапку одним файлом и не парился, но как-то раз прочел в Google Developers рекомендацию всегда указывать атрибут media для тэга link, чтобы браузер мог определять, загружать ли данный файл сразу, или же можно отложить этот процесс. На мой взгляд, если разбить responsive.css на 4 файла (сообразно основным размерам экрана, например, responsive-tablet.css, responsive-mobile.css и т.п.), и подключить их через 4 тэга link, загрузка сайта будет быстрее, т.к. файл, блокирующий отрисовку страницы, будет на 50-60 килобайт меньше. Выглядеть это, соответственно, будет как-то так:

<link rel="stylesheet" href="responsive-mobile.css" media="max-width: 480px">
<link rel="stylesheet" href="responsive-tablet.css" media="min-width: 480px and max-width: 768px">

Имеет ли смысл так делать?