Хабр Курсы для фронтендеров
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Поток Фронтенд доступен 24/7 благодаря поддержке друзей Хабра
Комментарии 17
Закреплённые комментарии
Вот данные Lighthouse, специально для тех, кто ставит этому комменту плюсы.
Сайт комментатора:
Мой сайт:
Поворот веб-разработки не туда — это пустота вместо контента на полностью статическом сайте при отключенном JS, как же вы надоели
А конкретно сайт «R&D-студии» не только безосновательно неработоспособен без JS, но и даже со включенным JS старательно сопротивляется чтению, ломая родную браузерную прокрутку и пряча весь контент после прокрутки, чтобы я полсекунды сидел и пялился в пустую страницу, нервничая в ожидании завершения анимации появления контента
Пожалуйста, прекратите доламывать и без того сломанный веб
Ваш комментарий как-то связан с темой статьи вообще? Если в ней есть что-то, что по вашему мнению, доламывает веб, напишите об этом, буду рад вам ответить на конструктивную критику. На сайт я даже ссылки не давал.
Контент на сайте доступен без JS. Не работают интерактивные виджеты на некоторых страницах, да, но это ваш выбор.
Минус не мой.
Контент на сайте доступен без JS.
То, что timestamp'ы в ссылках на файлы изменились на 21:21, намекает на то, что вы починили это уже после моего комментария (и после этого мой комментарий действительно стал не очень релевантен)
А был он чему релевантен? Я повторюсь, как это связано с темой материала?
Мои эксперименты с дизайном на сайте, который почти никто не читает и который я чаще сам показываю клиентам на переговорах - это может и интересная тема для обсуждения, но каким боком она тут?
Если что, я сам большой сторонник только необходимого минимума js на сайтах.
Меня больше смущает вот это загадочное 42.
Вот данные Lighthouse, специально для тех, кто ставит этому комменту плюсы.
Сайт комментатора:
Мой сайт:
Чем-то напомнило мне расширение стандарта ESM aka import assertion или же import attributes. styles.css.js лично для меня выглядит немного противоестественно, а писать стили в шаблонных строках не всегда удобно. Да, есть расширения для IDE с подсветкой синтаксиса и автокомплитом в шаблонных строках, но на моей практике они не работают так же хорошо, как нативные файлы. Import Attributes позволяют импортировать CSS и JSON, а в будущем HTML напрямую. Кажется, этот стандарт станет хорошим дополнением к вашей идее
В целом выглядит интересно, мне всегда любопытно наблюдать за standard-based решениями без лишних абстракций и кастомного синтаксиса на каждом углу. Поэтому удачи в развитии идеи!
Пример с CSS - особо показателен, так как в этом случае вы можете использовать полноценный мощный язык язык программирования с асинхронными вызовами вместо квази-форматов типа SASS или LESS. При этом, без дополнительных зависимостей и с возможностью использовать обычные CSS-исходники или даже шаблоны CSS-файлов (с чем-то типа `{MY_VALUE}`), загружаемые через fs. Ну и подсветка синтаксиса и автокомплит, на моей практике (я понимаю, что наш опыт может различаться) - работает вполне приемлемо. Нативные импорты в CSS (`@import`), кстати, грузятся асинхронно, и не позволяют контролировать порядок загрузки, в отличие от JSDA (еще одно преимущество).
А импортировать файлы произвольных форматов можно так: https://habr.com/ru/articles/685850/. Но на практике простого`fs.readFileSync` тоже вполне достаточно.
styles.css.jsлично для меня выглядит немного противоестественно
Скорее просто непривычно. На практике, встречая такой файл в проекте вы сразу понимаете что это и зачем, все предельно понятно на интуитивном уровне и гораздо удобнее чем прятать дополнительную мету где-то внутри файла. Вы знаете, что `.js` - просто отвалится при преобразовании и останется styles.css.
.
Это будет автоматически преобразовано в обычный HTML:
Вот это фраза что означает? Где и как это будет преобразовано в обычный html? Типа просто импортируешь модуль и код сразу вставляется в html? Или нужен еще один модуль, который вставит этот html в html? И того три модуля/скрипта: pagedata, index.html.js и еще один, который вставит html в html?
Благодаря изоморфизму и единому языку, JSDA, будучи, преимущественно, серверной технологией
А, т.е. помимо трех модулей js нужен еще сервер со сбоощиком. Может быть, в мире node.js это и прогресс.
Это означает, что в вашем дев-рантайме живет вотчер, который смотрит за файловой структурой, условно, папки src и автоматически сохраняет экспорт по умолчанию в виде файла соответствующего расширения, в папку, условно, dist, как только вы внесли изменение в код проекта. Это если у вас задействован SSG-воркфлоу. Этот вотчер может поставляться в виде npm-пакета, как в приведенном мной примере по ссылке. А может быть написан вами самостоятельно, один раз на проект, если вы хотите все контролировать и не хотите заниматься аудитом зависимостей, например. Полная свобода для вас.pageData - опционально, используется для динамического доступа к данным. То есть, для генерации HTML-страницы или CSS-файла достаточно всего ОДНОГО исходного файла, остальное - добавлять по вкусу.
Для создания html страницы или сss файла действительно достаточно одного исходного кода. Но тут ещё требуется сборщик для этого и отдельный модуль. Я на джанге похожее делал, там тоже есть рендер шаблонов в статические файлы html. Но это не то, "что может сделать веб-разработку "грейт эгейн", после тысячи поворотов "не туда", по-моему, скорее это просто довольно нишевая вещь и при этом довольно самоочевидная (при наличии соответствующей потребности). Удачи node.js сообществу на пути к здравому смыслу. И поменьше пафоса
Дело ведь не только в рендере шаблона, в самом таком рендере нет абсолютно ничего нового и писать об этом нет никакого смысла. Дело в том, как можно максимально упростить сложный воркфлоу, когда вы получаете мощный гибридный подход к созданию сложных приложение за, практически, бесплатно. Если тут что-то и сравнивать, то не с джангой а с каким-нибудь Next.js, к которому у разработчиков уже накопилось множество серьезных претензий. И не нужно снисходительности, пожалуйста. У Node.js есть ОЧЕНЬ большие преимущества, о некоторых из которых я, также, писал.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
JavaScript Distributed Assets — это просто