Якими способами і інструментами можна оптимізувати завантаження мобільних версій сайту стосовно адаптивному веб-дизайну? Іноді необхідно переробляти фронтенд без можливості змін серверної сторони, тому шукаю краще рішення з урахуванням цього моменту.
Ситуація 1. Є 2 js і 2 css файлу. Як можна зробити, щоб вантажився тільки js # 1 і css # 1, залежно від screen.width наприклад?
Ситуація 2. У dom є елементи з класом .only-desktop. в яких знаходяться зображення. Який найбільш швидкий і правильний спосіб запобігти завантаження зображень в .only-desktop?
заданий 4 Вересня '15 о 21:09
Тут офіційне керівництво від google, з прикладами.
Для початку скористайтеся одним з готових рішень. приклади додаються. HeadJs. мабуть, найпростіше.
Складні правила для media queries стають сильно простіше, якщо використовувати будь-якої препроцесор стилів і міксини
Цей приклад має на увазі, що ви використовуєте require або webpack, що підтримують збірку довантажувати модулів. Звичайно, ви можете використовувати будь-який доступний спосіб інжекції скриптів і ресурсів.
Тим же способом можна довантажити enquire, або будь-яку іншу з перерахованих вище бібліотек з cdn, не змінюючи серверну частину.
- Згідно з цим дослідженням. найефективнішим шляхом заборони завантаження зображень є каскадна перезапис властивості за допомогою @media queries
відповідь дан 8 Вересня '15 о 23:40
Це схоже на якусь передчасну оптимізацію. Якщо у вас дійсно такий великий сервіс, то тоді простіше генерувати макети під девайси на серверній стороні, як це робить наприклад apple.
Довантажувати css в залежності від дозволу, можна вказавши атрибут media в тезі link
Ви писали про modernizr.js, подивіться на yepnopejs за допомогою нього, ви зможете завантажувати необхідні вам стилі і js файли в залежності від умов.
Щоб зображення не завантажувалися відразу, використовуйте атрибут fake-src і туди пишіть url для фото, потім за допомогою JS підставляти url зображення з fake-src в src.
відповідь дан 8 Вересня '15 о 17:15
Дякуємо. На жаль, іноді необхідно переробляти фронтенд без можливості змін серверної сторони, тому шукаю краще рішення. Додам даний момент в питання щоб було зрозуміліше. Оскільки термін закінчення конкурсного питання через 7 днів, чекаю ще варіанти, можливо буде ще щось цікаве. - Viacheslav Soldatov 8 Вересня '15 о 20:56