Интернет пестрит ответами на технические вопросы, а у меня, как всегда, проблемы с другими аспектами программирования, а именно со стилем написания кода для Vue/Vuex. В данный момент вспомнились следующие вопросы:
1) Обязательно ли возвращать состояние хранилища в вычисляемом свойстве? Это предлагается сразу же в первых разделах документации по Vuex. Будет ли bad-practice, если мне нужно будет всего лишь несколько раз использовать конструкции вроде this.$store.state.smth?
2) Насколько должна быть нагружена мутация внутри хранилища?
Допустим, есть много различных функций, каждая размером строк 30 кода, не менее. Красиво ли будет, если я опишу их в полном размере прямо в хранилище, даже если несколько из них используются только в одном компоненте? Или необходимо сделать как можно меньшим размер хранилища, перебросить функции в компонент и оттуда, когда нужно будет передать результат в state, передать его через мутацию, в которой будет лишь присваивание и ничего более?
3) Какова нормальная длина модуля для однофайлового Vue-компонента?
4) Если не думать о шаблонизаторах, какой стиль написания кода html в модулях Vue наиболее привлекателен и понятен, есть ли у вас примеры?
На самом деле список вопросов на этом не заканчивается. Если у вас есть какие-то ссылки на ресурсы, где имеются рекомендации, которых нет в официальной документации, предложите пожалуйста.
Тут всё просто: Функцция или данные нужны только в одном компоненте или в нескольких? В одном — всё в компонент. Иначе в хранилище. Сами мутации должны быть как можно легче. Они блокируют интерфейс.
Чем меньше тем лучше. Любую несвязанную логику лучше выносить в отдельный компонент. Это опять таки скажется на производительности в лучшую сторону
Что я заметил, тут молодой человек разместил состояние таймера и многие другие вещи в state, в результате консоль во время действия таймера захламляется несколькими записями каждую секунду + если в сапере открывается несколько клеток, то открытие каждой из них сопровождается записью в консоли. Если отбросить бредовость размещения таймера в хранилище, допускается ли большое количество записей во vue devtools при открытии большого числа клеток? Или, например, если мины расставляются после первого хода и каждое присваивание клетке статуса мины сопровождается записью в консоли?
Очень тяжело жить без рекомендаций по использованию именно vuex. Сейчас всё чаще стал нарываться в статьях на совет никогда не вызывать мутации напрямую, только через действия. Хотя логика до конца не ясна: если метод исключительно синхронный (как, предположим, установка флага в том же сапере, элементарная операция) - зачем оборачивать его еще и в действие? Полагаю, действие - всего лишь обертка для отслеживания асинхронных изменений, не дающее ничего особого?
1. Нет. Зевс молнией вас не испепелит. Втыкать лишнее computed заради одного единственного вызова никакого смысла нет.
2. В хранилище должны быть только функции относящиеся к хранению данных. Некоторые пихают в store чуть ли не всю логику приложения, как по мне, так это форменное безумие.
У вас есть повторяющийся код связанный с работой с данными? Используйте миксины или вообще просто обычные отдельные js модули.
3. Маленькая.
4. Такой же как и без vue - аккуратная вёрстка с использованием разумной системы(БЭМ и пр.). Никакой излишне сложной логики в шаблоне быть не должно, а потому оная на это практически не влияет.
Для действительно сложной логики, способной превратить шаблон в кашу, используется render функция.
Что я заметил, тут молодой человек разместил состояние таймера и многие другие вещи в state, в результате консоль во время действия таймера захламляется несколькими записями каждую секунду + если в сапере открывается несколько клеток, то открытие каждой из них сопровождается записью в консоли. Если отбросить бредовость размещения таймера в хранилище, допускается ли большое количество записей во vue devtools при открытии большого числа клеток? Или, например, если мины расставляются после первого хода и каждое присваивание клетке статуса мины сопровождается записью в консоли?
Очень тяжело жить без рекомендаций по использованию именно vuex. Сейчас всё чаще стал нарываться в статьях на совет никогда не вызывать мутации напрямую, только через действия. Хотя логика до конца не ясна: если метод исключительно синхронный (как, предположим, установка флага в том же сапере, элементарная операция) - зачем оборачивать его еще и в действие? Полагаю, действие - всего лишь обертка для отслеживания асинхронных изменений, не дающее ничего особого?
