Vue.js как добавление реактивности

Server Side Rendering? Если я правильно понял проблему.

Ну в основном да. Т.е. рендерим страницу, там один или два или больше элементов пустые (id='app', id='some_form', …), их уже обрабатывает vue (например просто рендерит какую-то форму или при загрузке странице делает запрос на бекенд, чтобы получить информацию для отображения).

Чтобы шарить между ними данные - есть shared bus, в доках vue всё есть. На крайняк, vuex.

Тебе нужен Polymer и plain js, vue не бери, если не понимаешь пользоваться. А гибридный рендеринг — трушный подход, я считаю, сам так делал. Таким образом можно держать баланс между скоростью отрисовки и нагрузкой на сервер, между лёгким Web API и бекендом для сайта.

shared bus

Эпичный костыль.

А почему SPA все же не сделать? Если требуется сделать сайт более «дружелюбным» для поисковых систем, что есть nuxtjs, который позволит рендерить страницы прямо на сервере.

Просто то, что ты хочешь - это, честно говоря, лютый велосипед. Я не работал с Vue (React юзаю), но, мне кажется, ты пытаешься микроскопом забивать гвозди. Всякие React/Angular/Vue и т.п. - это не замена jQuery, а все же для SPA больше.

По-моему ты просто хочешь странного, и от этого получается печально.

Посмотри knockout.js, если тебе просто кусочек странички иногда надо подхачипурить.

Реакт посмотри. Он, в отличие от Vue, библиотека, а не фреймворк. Просто вызываешь ReactDOM.render(<MyWidget />, document.getElementById("my-widget")) в нужные места своего DOM, а данные хранишь в едином Redux-хранилище, например.

Vue подойдет, но оно только внешне приветливая маленькая либка. Вскоре выясняется, что код надо писать в .vue-файле, который поддерживается в полутора IDE. А чтобы этот .vue скомпилить, это нужна нехилая такая система сборки.

Если хочется маленького и несложного, можешь глянуть связку preact, preact-portal, unistore.

А «реактивность» это не только и не столько про интерфейс, сколько про поток данных. Можно ознакомиться с mobx для понимания

Vue подойдет, но оно только внешне приветливая маленькая либка. Вскоре выясняется, что код надо писать в .vue-файле, который поддерживается в полутора IDE. А чтобы этот .vue скомпилить, это нужна нехилая такая система сборки.

Тащемта ненужно.

Если мазохист, то можно писать vue шаблоны в html-файле. И ловить ошибки шаблонов нажатием F5 в браузере. Впрочем, ТС на джанго пишет, ему наверное не привыкать)

Переходи на Svelte

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

гугл умеет индексировать спа

А яндекс и байду?

vue поддерживается vscode. да и сам формат шаблонов такой, что это простой html, а значит подсветка синтаксиса будет везде работать.

это простой html

Нет. Это убогий html-подобный DSL для реактивных render-функций. А «подсветка синтаксиса» vue-шаблонов не ограничивается html-тэгами

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

html5 подразумевает кастомные элементы, а значит все это валидный хтмл

Почти не пользуюсь гуглом. Он вырезает из поиска почти всё, что запрещено РКН. Сторонними поисковиками часто больше можно найти

Самое вкусное не анализирует. То, что за фигурными скобками

да ты бред какой-то пишешь.

Ну как бы ни один бизнес не станет отказываться от дополнительного трафика - это ж потенциальные клиенты. Отсюда и поддержка старых браузеров, мобильные версии и т.п. А в РФ и СНГ траф с Яндекса - вполне себе ощутимая вещь, смысл от него отказываться? Да и Гугл SPA сайты до сих пор, насколько знаю, индексирует хуже обычных.

P.s. есть ssr (для Реакта есть Nextjs), который решает эту проблему.

это серасты обычно рассказывают. я этих деятелей как и 10 лет назад вижу по большей части мошенниками. там-то ясно с чем могут быть проблемы: ключевые слова, описание страницы не задачь через мета теги, но у этого сайта их вообще нет, что не мешает ему быть в топах поисковиков. я считаю, что нужно делать интересные сайты, а не пытаться обмануть поисковики. для vue эта вещь называется nuxt.js.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8"/>
    <title>Document</title>
  </head>
  <body>
    <div id="app1">
      <input v-model="message" type="text" />
    </div>
    <div id="app2">
      <input v-model="message" type="text" />
    </div>
  </body>
  <script src="vue.js"></script>
  <script>
    var bdata = {message: "sdfdsf"}
    
    var app1 = new Vue({el: '#app1', data: bdata
		   });
    var app2 = new Vue({el: '#app2', data: bdata
		   });

  </script>
</html>

давно не трогал вуй не помню что там как

Вот да. Плюс траффик это просто траффик, измерять потенциальных клиентов траффиком - безумие.

Решил я сделать свой мини сайт на vps для лично своих заметок и прочих нужд.

То, что ты собираешься делать - займёт несколько недель секаса. Возьми любую подходящую CMS, разверни за 5 минут и начни пользоваться. Сэкономишь себе кучу времени, а результат тот же. Если цель - именно занятие с Vue - так тоже сомнительный профит, завтра какой-нибудь школьник изобрёт Hrew.js и весь твой опыт вникуда.

Нет ты

Написал конфиг для webpack

Вы пробовали code splitting? Можно взглянуть на конфиг?

Собственно вопрос <поток сознания>

А в чем собственно вопрос?

Собственно вопрос — неужели всё так печально?

Что печально-то, блджад?

вдруг, мне понадобится шарить между ними какие-то данные? Скидывать всё в localStorage и добавлять кругом разных eventListener чтобы всё это отслеживать?

Наркоман. https://jsfiddle.net/b942pgew/