webirus
@webirus
Тыжверстальщик! Наверстай мне упущенное...

А что если писать сайт вообще в одном файле?

Не примите вопрос как реальную задачу! Ни в коем случае)

Просто стало интересно после моего прошлого вопроса ( Имеет ли смысл объединять JS скрипты? ).

А что если всю верстку делать в одном файле?
И стили, и скрипты, и картинки (можно вообще в base64).

Понятно, что будет неудобно работать, но это допустим не важно. Привыкнется)))

Приведу пример: Есть сайт-одностраничник, на нем 200 строк JS, около 1000 строк CSS, ну и допустим 1000 строк HTML. Ни библиотек, ни скриптов дополнительных, чисто HTML, JS, CSS.
Можно ли (и нужно ли) сделать всю эту простыню в одном index.html файле?
И до кучи его минифицировать в одну строку)
Речь не идет про крупный проект, портал или магазин. Простой одностраничник)

Повторюсь, просто интересно, насколько такой вариант плох или хорош?
  • Вопрос задан
  • 2604 просмотра
Решения вопроса 5
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Гугл примерно так и делает. посмотрите исходник страницы.

И вовсе это не неудобно. Разработка ведется как обычно - в разных файлах, потом все склеивается и выкатывается.
Однако, мне видится, должна быть веская причина так делать.

PS Для одностраничника вполне оправданно упаковать все в один файл. Кроме, пожалуй изображений в base64 =).
Ответ написан
Wolfnsex
@Wolfnsex Куратор тега CSS
Если не хочешь быть первым - не вставай в очередь!
Сказать по правде, Вы немного странно ставите вопрос... мне кажется, актуальнее было бы уточнить, о причинах, по которым нужно объединять файлы в один.

Понятно, что будет неудобно работать, но это допустим не важно. Привыкнется)))
Неудобно работать кому, Вам, или браузеру? Если браузеру, то за него не беспокойтесь, он парень сильный, справится. Если Вам - то есть сборщики проектов, коих как грибов в лесу. На крайняк можно написать свои 20 строк кода.

Речь не идет про крупный проект, портал или магазин. Простой одностраничник)
Вопрос звучит примерно как: "я тут приехал в какую-то деревню (город с населением 200тыс. человек), стоит ли там соблюдать правила дорожного движения и законы? Это же не миллионник и даже не мегаполис..."

Дело не в том, скольки-страничник сайт, а в причинах, которые послужили предпосылкой к объединению скрипто-стилевого мусора в один файл. Основных причин было несколько:

1. Большой файл грузится быстрее, чем много маленьких, по тому, что:
а) Обращение к дисковой системе происходит 1 раз
б) Исчезает промежуточный мусорный обмен трафиком между сервером, на загрузку каждого дополнительного файла

2. Особенность браузеров, работающих по поротоколу HTTP 1.0/1.1 заключается в том, что они не могут открывать более 16-32 соединений (если мне память не изменяет, точные цифры не помню). Это значит, что одновременно более 16-32 файлов скачиваться не будет. А теперь представьте, что у Вас на "одностраничнике" штук 300 спрайтов, на всякие соц. сети, иконки, стрелки и пр. лабуду, и каждый будет загружаться отдельно...

Я думаю, Вы уже знакомы с протоколом FTP... Попробуйте как-нибудь, ради интереса загрузить на сервер любую CMS, в которой 5-15тыс. файлов по FTP, в распакованном виде. А потом попробуйте упаковать все эти файлы в архив, с нулевым сжатием (TAR или ZIP без сжатия), загрузить на сервер и распаковать. Даже на самом "мёртвом" сервере, даже с учётом времени на распаковку, процедура с архивом обычно проходит в несколько (иногда десятков) раз быстрее, чем загрузка каждого файла по одному. В браузере разница не настолько критична, принцип тот же.

Среди прочего, хочу отметить, что для протокола HTTP/2, который пока поддерживают ещё не все браузеры (хотя таковых и большинство) и далеко не все хостеры и админы осилили его интеграцию, проблема уже не так актуальна. Но одна из причин, по которой HTTP/2 позволяет ускорить загрузку заключается как раз в том, ограничение с пулом запросов было решено.

Так же, сжатие всех скриптов в один - позволяет решить проблему порядка загрузки, и добавить скрипту флаг async, что было довольно актуально для меня в ряде случаев. А CSS - тем более грузятся по порядку, т.к. это каскадные таблицы, и как бы Вы их там не вращали, браузер априори будет их читать линейно и так же линейно применять, именно в том порядке, в котором они были указаны к загрузке. И в этом случае, сочетание протокола HTTP/1.0|1.1 и отсутствие многократного дёргания сервера, довольно очевидно.
Ответ написан
Комментировать
Внешние JS/CSS кешируются, но это полезно если на сайт один человек заходит второй раз или ползает по страницам сайта, а когда одноразовые промо-странички, то может и имеет смысл, только опять тоже параллельной загрузки не будет.
Ответ написан
Комментировать
Если не ошибаюсь, такой подход плох с точки зрения производительности, а конкретно скорости загрузки. Когда файлы подключены через теги, то загрузка происходит асинхронно. Но опять же, это заметно, когда весь этот букет весит 1+мб.
Ответ написан
Комментировать
xPomaHx
@xPomaHx
1vs9
Я делал такое, неудобства использования нет никого тк все делает галп, у меня была папка с исходниками, и выдает 1 файл. Все стили скрипты инклюдилисьв страницу, а картинки и шрифты в base64.
Страница грузится нормально без каких то косяков, минус один она вся получиться 12мб. И сервисы типа google pagespeed отказываются хвать больше 8мб. Я не смог клиенту объяснить что пофиг на пейджспид страница гарантированы быстрее открывается чем без такого сжатия в 1 файл, но он отказался приказал по старому делать.
Я лично вообще не вижу каких то причин делать одностроничники не 1 файлом.
Если хотя бы 2 страницы тогда да лучше чтобы браузер отдельно кэшировал все картинки, но если на сайт тока 1 то можно закешировать всю страницу целиком и это будет быстрее работать.
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
Zifix
@Zifix
Barbatum
Я как-то раз слышал от знакомого фрилансера, что его наняли внести небольшие изменения на сайт, который оказался написан на Перле, в одном файле, включая веб сервер.
Ответ написан
@Norval
Если CSS и JS код вставлять в HTML, то для лендинга это нормально. Когда всего 1 страница. Если 2 и более - однозначно внешний файл стилей использовать стоит.
Картинки всегда подключаю тэгом IMG, хотя видел кодируют через base64...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
29 мар. 2024, в 17:14
4000 руб./за проект
29 мар. 2024, в 17:04
5000 руб./за проект
29 мар. 2024, в 17:03
3000 руб./за проект