Верстка через JS?

Question

[Владимир Голубь]

Хотел взять заказ на фрилансе, но увидел вот такое view-source:www.napalubu.ru

Это конструктор или очень крутой верстальщик ?

Comments

[Андрей Б.]

Аля свой микро фреймворк на JS на коленке

[Kovalsky]

Клянусь бабушкой, это не конструктор. Мне, по крайней мере, так не кажется. Слишком много кастома, нелепых условий. Конструкторы несмотря на все недостатки это всё же сложные системы состоящие из большого количество хитро сплетённых модулей.

Что за задача у вас? А то первое что мне пришло в голову, это то что они вас попросили "перепишите нам пожалуйста сайт просто на HTML, а то ни хрена не работает, все верстальщики/программисты отказываются с нами работать"

[Philipp]

Это называется "разработчику было нечем заняться".

[KingAnton]

25мбайт страница )

[Алексей Уколов]

Качество этой поделки красноречиво демонстрирует подключение jquery (не сжатой!) и использование его в трёх местах (где можно спокойно написать ванильно).

[Владимир]

Реакт. Начало.

[Дмитрий Балашов]

document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[1].style.backgroundImage = 'url("pictures/DSC00274.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[2].style.backgroundImage = 'url("pictures/DSC00280.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[3].style.backgroundImage = 'url("pictures/DSC00282.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[4].style.backgroundImage = 'url("pictures/DSC00284.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[5].style.backgroundImage = 'url("pictures/DSC00291.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[6].style.backgroundImage = 'url("pictures/DSC00297.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[7].style.backgroundImage = 'url("pictures/DSC00301.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[8].style.backgroundImage = 'url("pictures/DSC00302.jpg")';
document.getElementsByClassName('script-gallery')[0].getElementsByTagName('div')[9].style.backgroundImage = 'url("pictures/DSC00303.jpg")';

Красота!

Answer 1

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

очень крутой верстальщик

Скорее, очень хреновый) Это ужасно... если появится список сайтов для поднятия самооценки разработчиков, этот занял бы там одно из почетных мест.

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

Answer 2

[Александр Моргунов]

На мой взгляд верстка не самая удачная. Да еще и в индекс ее запилили...
Делалось все руками с помощью JS.
P.S.: Если ищешь фреймворки для верстки, то советую обратить внимание на Vuejs и webix.

Answer 3

[Павел Волынцев]

Это ужасный сайт, который не выполняет своих функций.

В основе лежит манипулирование DOM в реальном времени (синхронное) - это довольно ресурсоёмкое дело, поэтому страница "рисуется" очень долго.

Нет шаблонизатора, все операции с DOM выполняются непосредственными командами над объектами. Очень сложно будет найти место, в котором надо изменить текст или стили, а ещё сложнее что-то добавить или удалить.

Не работает то, что должно работать именно на JS. Меню глючит, разворачивающиеся блоки глючат, слайдшоу не запускается.

По факту, программист не знал ни HTML, ни CSS, но знал ванильный JS. Он сделал на JS то, что надо на HTML. А то что надо на JS - не сделал. Если бы это была выпускная работа в какой-нибудь интернет-школе (даже те самые презираемые за излишнюю упрощённость Специалист, гикбрейнс или HTML Academy) - эта работа получила бы 2 (неуд, фейл, провал).

Переделывать заново. От клиентского рендеринга можно вообще отказаться в пользу HTML или серверного языка программирования (PHP, Python, Ruby, NodeJS). JS использовать там где надо, а не там где хочется.

Comments

[Александр Моргунов]

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

Answer 4

[Niriter Inc.]

через js не стоит, гугл и яндекс не понимают js элементы

Comments

[Александр Моргунов]

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