зачем вам гидрировать на стороне клиента, если вы можете собрать готовый html на сервере и вернуть его?
ваш vue-server-renderer, берет просто template готовый, и отдает его, типо не голый body, а с какой то разметкой, по факту он ничего не рендерит на стороне сервера
<div>
<h3>Cart:</h3>
<div>
<div v-for="(item, idx) in items">
{{ item.product.name }}
</div>
</div>
</div>
<div><h3>Cart:</h3><div><div>Product 1</div><div>Product 2</div><div>Product 3</div></div></div>
Поскольку сервер уже отобразил разметку, мы, очевидно, не хотели бы её выбрасывать и заново создавать все элементы DOM. Вместо этого мы хотим «гидрировать» статическую разметку и сделать её интерактивной.
Если кратко, то, Vue по дефолту, занимается всем на клиенте, но когда такое не возможно, (типо JS не работает), вступает в игру SSR.
Вы сами то знаете для чего вам SSR?
Гидратация относится к процессу на стороне клиента, в течение которого Vue берёт статический HTML, отправленный сервером, и превращает его в динамический DOM, который может реагировать на изменения данных на стороне клиента.
А причем у вас Vuex и SSR?
Пусть это будут разные контакты и всё.
abstract class MyBase
{
protected $dependencies = [];
public function __construct(ConsoleOutput $consoleOutput, Logger $logger)
{
$this->logger = $logger;
$this->consoleOutput = $consoleOutput;
}
public function runMyMethod(array $params = [])
{
$this->consoleOutput->print('start at ' . microtime(true));
$result = $this->myMethod(...$params);
$this->consoleOutput->print('end at ' . microtime(true));
return $result;
}
public function __call(string $name, array $arguments)
{
$class = $this->dependencies[$name];
/**
* @var MyBase $base
*/
$base = new $class($this->consoleOutput, $this->logger);
return $base->runMyMethod($arguments);
}
// abstract protected function myMethod();
}
class Foo extends MyBase
{
protected $dependencies = [
'bar' => Bar::class,
];
protected function myMethod()
{
$this->logger->log('Foo myMethod');
return $this->bar('str', 5);
}
}
class Bar extends MyBase
{
protected function myMethod(string $s, int $i)
{
$this->logger->log('Bar myMethod');
return $s . ', ' . $i;
}
}
Можно считать, что у меня простейшее API, которое может только сохранять состав корзины и выдавать его. Страничка, на которой выводится список продуктов в корзине.
Соотв. я получаю состав корзины; формат, надеюсь, не имеет значения... например
Подобные данные я получаю на сервере и рендерю страницу. Далее, если не производить корректной гидрации, клиент посылает такой же запрос к API и получает ровно такие же данные. (мне же хочется избежать повторного запроса)