LINUX.ORG.RU

Vue

 


0

1

Подскажите как правильней сделать. Есть



function getUserPopupEl(user){
    templEl = $("#template").clone();
    let vm = new Vue({
        el: templEl[0],
        data: user
    })
    
    return templEl; //если $(vm.$el) то нормально
}

function addPopup(user){
    $('body').append(getUserPopupEl(user))
}

addPopup({nickname: "Вася"});



Проблема в том, что vue создается на элементе, который ещё не добавлен в DOM дерево и после добавления templEl в body выводится сырой необработанный шаблон. Если же возвращать элемент vm.$el, то нормально. Правильно ли делаю или есть какой то более правильный способ?

★★★★

Я не умею в vue, но наверное неправильно. Тебе дали фреймворк для работы с DOM, нафиг ты его руками дергаешь через $('body').append?

vazgen05 ★★★
()
Ответ на: комментарий от vazgen05

Потому что это bootstrap popover


$(".popover").popover({
   content: function(){
      return getUserPopupEl({nickname: "xxx"});
   }
})



Я его использую(точнее пытаюсь) только в качестве шаблонизатора, с дом я использую jQuery, Мне нужно сначала отрендерить шаблон, а потом его добавить в popover. Или что сначала добавить сырой шаблон в ДОМ, а потом его через VUE отрендерить? Но мне кажется будет некрасиво, юзер будет видеть сначала разметку vue, а потом html

gobot ★★★★
() автор топика

Правильно ли делаю или есть какой то более правильный способ?

Отдавать нормальный html вместо кучи js скриптов. А то опять где-нибудь что-нибудь обновят и сайт станет тыквой, а поправить будет некому.
/thread

crutch_master ★★★★★
()
Последнее исправление: crutch_master (всего исправлений: 1)

DOM ready никто не отменял

anonymous
()
Ответ на: комментарий от gobot

Что значит нормальный?

То есть сразу всю нужную инфу генерить на серваке, а не высирать каркас, которых потом заполняется всякими говноскриптами.

crutch_master ★★★★★
()
Ответ на: комментарий от crutch_master

Так данные не с сервера берутся, а их клиент сам генерирует

gobot ★★★★
() автор топика
Ответ на: комментарий от crutch_master

Сервер один, а клиентов много. Причём нынешние клиенты по производительности не особо уступают серверам.

KivApple ★★★★★
()
Ответ на: комментарий от vazgen05

Ага, щас я буду весь рабочий сайт в твои обертки заворачивать. Вообще сайт проектировался на основе $ и bootstrap, но вчера мне захотелось наполнять шаблоны не через el.find(«input»).attr(«title», «путин дурак»), а через какой нибудь шаблонизатор, ну и выбрал из-за простоты и малого веса этот vue

gobot ★★★★
() автор топика
Ответ на: комментарий от ritsufag

плюсую

Vue нужен, что бы так

  templEl = $("#template").clone();

не делать

pru-mike ★★
()
Ответ на: комментарий от KivApple

Сервер один, а клиентов много. Причём нынешние клиенты по производительности не особо уступают серверам.

Какая разница? Ты в любом случае данные откуда-то передаешь так или иначе.

crutch_master ★★★★★
()
Ответ на: комментарий от crutch_master

сразу всю нужную инфу генерить на серваке, а не высирать каркас

И верстать ещё таблицами, а кнопки обязательно картинками.

ddidwyll ★★★★
()
Ответ на: комментарий от ddidwyll

И верстать ещё таблицами, а кнопки обязательно картинками.

В новой версии браузера жс начинает работать не так , как хотелось бы, внешний сайт, с которого ты тащил скрипты отваливается и все любуются твоим каркасом. А заказчик создаёт тред на фрилансе.
Хотя уеб-хипсторам какая разница, главное чтобы было модно, а не чтобы работало.

crutch_master ★★★★★
()
Последнее исправление: crutch_master (всего исправлений: 2)
Ответ на: комментарий от crutch_master

В новой версии браузера жс начинает работать не так

Ээ, если следовать документации такого не будет, по-крайней мере я про такое не слышал.

внешний сайт, с которого ты тащил скрипты отваливается и все любуются твоим каркасом

Что ещё за внешний сайт? Не надо ничего таскать, ничего и не отвалится. Если же твой сервер умер, то без разницы данные он не отдаст или весь сайт целиком. Вот только с жс и нормальным кэшированием сайт может остаться полностью работоспособным если сервер лежит (если у пользователя в кеше он есть).

Хотя уеб-хипсторам какая разница, главное модно.

Не знаком с хипсторами, но сам представь что-то вроде саундклауда без жс. Понятное дело для информационной странички лучше вообще статика без каких-то ЯП. Надо правильно выбирать инструмент (а не страдать хипрсторством или ретроградством) и будет хорошо.

ddidwyll ★★★★
()
Последнее исправление: ddidwyll (всего исправлений: 1)
Ответ на: комментарий от crutch_master

Что за наглое 4.2 JS все и попрекают за то, что он через 20ти летие пронес кучу легаси в стандарте, а ты тут уповаешь на то, что ломают обратную совместимость. Ломается она у тех, кто мог использовать какие-то фичи, которые не входят в спеки самого языка и окружений. Ну, а за использование таких фич в продакшене, стоит ломать руки, чтобы не ломалось что-то еще.

anonymous
()
Ответ на: комментарий от anonymous

Ну, а за использование таких фич в продакшене, стоит ломать руки, чтобы не ломалось что-то еще.

Про это и речь.

crutch_master ★★★★★
()
Ответ на: комментарий от ddidwyll

Что ещё за внешний сайт?

Когда у тебя сайт на одном хосте, а скрипты с другого.

но сам представь что-то вроде саундклауда без жс.

Да я не говорю, что там не должно быть совсем жс. Он _должен_ сразу отдавать всю информацию, которая там должна быть, а не тащить её кусками. Потому что так у тебя одна точка отказа, а если тащить по кускам ajax'ом - минимум по числу кусков.

Вот только с жс и нормальным кэшированием сайт может остаться полностью работоспособным если сервер лежит (если у пользователя в кеше он есть).

Любая статика останется и без js «работоспособной».

crutch_master ★★★★★
()
Ответ на: комментарий от crutch_master

Любая статика останется и без js «работоспособной».

Реализуешь на статике сортировку или фильтрацию списка нескольких тысяч элементов?

Когда у тебя сайт на одном хосте, а скрипты с другого.

В нормальных проектах cdn дублируются. Это вообще не проблема языков, а архитектуры. Если у тебя DNS отвалится, в этом тоже язык виноват?

Об этом и речь

О чем об этом. Ты написал, что если браузер обновится - js отвалится, и в этом якобы виноват js или браузеро-строители. Хотя проблема не касается вообще никакой конкретной области. Ты где угодно можешь, что угодно реализовать через жопу используя грязные хаки, которые потом внезапно перестанут работать, потому что они и не должны были. А считать всех криворукими априори, только потому что потому что-то (например потому что речь о js) это идиотизм.

anonymous
()
Ответ на: комментарий от crutch_master

Данные можно гонять между клиентами, не передавая на сервер, например через вебсокет. Согласен, что в основном генерировать html приходится на сервере, но мой случай как раз исключение

gobot ★★★★
() автор топика
Ответ на: комментарий от gobot

но мой случай как раз исключение

Что у тебя за проект такой?

Данные можно гонять между клиентами

Из браузера, между клиентами? ._О

crutch_master ★★★★★
()
Ответ на: комментарий от gobot

Ага, щас я буду весь рабочий сайт в твои обертки заворачивать. Вообще сайт проектировался на основе $ и bootstrap, но вчера мне захотелось наполнять шаблоны не через el.find(«input»).attr(«title», «путин дурак»), а через какой нибудь шаблонизатор, ну и выбрал из-за простоты и малого веса этот vue

Ага, значит обёртку использовать религия не позволяет, а тащить фреймфорк в роли шаблонизатора - это зашибись.

blackst0ne ★★★★★
()
Ответ на: комментарий от anonymous

Реализуешь на статике сортировку или фильтрацию списка нескольких тысяч элементов?

Заливаешь объект в <script> инлайном и делаешь с ним что хочешь. Какой только в этом смысл, если работаешь из кеша браузера.

В нормальных проектах cdn дублируются.

Ключевое слово «Нормальных». Сколько у нас именно нормальных проектов? А ссылки на левые хосты тащят просто так по приколу.

js отвалится, и в этом якобы виноват js или браузеро-строители

В этом виноваты твои фантазии.

Ты где угодно можешь, что угодно реализовать через жопу

Я про это и говорю. Не надо реализовывать через жопу, если можно сделать нормально.

crutch_master ★★★★★
()
Ответ на: комментарий от ddidwyll

а кнопки обязательно картинками.

Тут один решил кнопки картинками не делать, что ты, не модно же нынче, тем более, что есть utf шрифты, где есть все нужные символы, и в итоге, вместо двух 2кб картинок тащит 1.5мб шрифт.

crutch_master ★★★★★
()
Ответ на: комментарий от crutch_master

Потому что так у тебя одна точка отказа, а если тащить по кускам ajax'ом - минимум по числу кусков

Бгг, ты в каком веке застрял? )

gobot ★★★★
() автор топика
Ответ на: комментарий от gobot

Бгг, ты в каком веке застрял? )

Ты в курсе, что не все ходят в интернет через wi-fi/кабель? Дохрена народа ходит через телефон (представляешь?), а еще есть куча 3ж свистков (неожидано, да?). И связь там не всегда хорошая.
И вот, ты грузишь кучу скриптов откуда попало с пингом 200мс, потом эта куча скриптов выполняет кучу ajax'ов, опять таки с пингом 200мс в лучшем случае, и будет очень хорошо, если из-за этого ничего не развалится и в процессе все нужные данные будут получены, т.к. провайдер может тупо сбросить лишние соединения, если их слишком много.
Да, в этих условиях весь крутой сайт на вуе.жс превращается в кусок вонючего говна, а сайты, которые просто отдают всё и сразу просто работают и остаются няшками.

crutch_master ★★★★★
()
Последнее исправление: crutch_master (всего исправлений: 3)
Ответ на: комментарий от gobot

Его задача прежде всего облегчить разработку SPA. Да, он легко встраивается и в классические проекты с серверный рендерингом(он кстати и это может), но в твоем случае даже биндинги не нужны.
Если тебе нужно просто отрендерить данные по шаблону, а потом сношать это при помощи jquery, то просто возьми какой-нибудь Handlebars.js или любой другой популярный шаблонизатор.

ritsufag ★★★★★
()
Ответ на: комментарий от crutch_master

Выхожу с телефона на высокоJSсные сайты, нормально ) А кто сидит на 3Г - пусть читают lib.ru или ЛОР )

gobot ★★★★
() автор топика
Ответ на: комментарий от ritsufag

Биндинги я использую. А чем Vue хуже Handlebars?

gobot ★★★★
() автор топика
Ответ на: комментарий от gobot

А кто сидит на 3Г - пусть читают lib.ru или ЛОР

Вся суть современного веб кодинга. Нет нормального интернета/32гб памяти/8 ядер - иди куда-нибудь.

crutch_master ★★★★★
()
Последнее исправление: crutch_master (всего исправлений: 1)
Ответ на: комментарий от crutch_master

Обычного HSPA\LTE и телефона Sony Xperia Z хватает, зачем ориентироваться на устаревшие технологии и старое оборудование, к тому же если сайт развлекательный, если даже от IE<10 отказались

gobot ★★★★
() автор топика
Ответ на: комментарий от KivApple

Часть рендеринга можно переложить на клиента.

Собрать 40кб xml, конечно, архисложная задача, особенно для сайтов с 100 посетителей/сутки.

crutch_master ★★★★★
()
Ответ на: комментарий от KivApple

Часть рендеринга можно переложить на клиента.

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

anonymous
()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.