Announcing Feathers-Vuex 3.14.0
We have received lots of 🎁 from the community with this release. Here they are in chronological order of contribution:
🎁 Better Error Messaging
First, @JorgenVatle improved the developer experience for anybody using the useFind and useGet composition API utilities. Before this contribution, if you accidentally left out the model arguments, you’d see an error message like the one below. It’s admittedly not very clear what the problem is:
Cannot read property
getFromStorefrom undefined.
New error messages will now get right to the problem's specifics, letting you know that the model option is missing. Thank you, @JorgenVatle!
Here’s the original PR: https://github.com/feathersjs-ecosystem/feathers-vuex/pull/539
🎁 Event Batching / Bulk Event Handling
Feathers-Vuex just got upgraded with automagic and efficient batching of events! This will significantly speed up UI response in our apps and prevent a lot of locking UI cycles. Events will now be handled in debounced queues of 20 ms, with a maximum debounce window of 1 second. Both of these values are configurable through the debounceEventsTime and debounceEventsMaxWait options.
We recently witnessed a couple of inspiring moments that led to this awesome contribution by @fratzinger.
- The release of feathers-batch with its new client plugin (which works like magic to speed up an app, by the way). When upgrading a couple of apps to use these new batch tools built by @daffl, I noticed a big difference in startup time for apps, pages, and request-heavy components. It basically enabled one of my favorite GraphQL features for my preferred Restful API solution (In case you missed it, FeathersJS is my favorite;) Now you can query multiple endpoints with a single request to the API server. It’s just efficient.
- This issue (filed by @kshitizshankar) about optimizing bulk patch responses to improve performance.
I think @fratzinger already had a solution for these things in mind before the two events above. So maybe the inspiration was more to get us on the same page. Whatever the case may be, this is a fantastic contribution that saves a lot of mutation cycles. Thank you, @fratzinger!
Here’s the original PR: https://github.com/feathersjs-ecosystem/feathers-vuex/pull/546
🎁 Improved Store Customization
We now have a cleaner API for customizing a service’s default Vuex store. Introducing the extend option! It’s really such a simple thing, but it’s a nice update for keeping Vuex code organized. Check it out in this example:
import { makeServicePlugin } from ‘feathers-vuex’
import { feathersClient } from ‘./feathers-client.js’
class Todo { /* truncated */ }
makeServicePlugin({
Model: Todo,
service: feathersClient.service(‘todos’),
extend({ store, module }) {
// Listen to other parts of the store
store.watch(/* truncated */)
return {
state: {},
getters: {},
mutations: {},
actions: {}
}
}
})The old state, getters, mutationsand actions options for customizing the store still work, but they are deprecated. This means they’ll be removed in the next major version of Feathers-Vuex. The biggest improvement here is access to the store object in the same file as other customizations. This means it’s easier to keep code organized and grouped.
Here are the commits where the magic happened:
- https://github.com/feathersjs-ecosystem/feathers-vuex/commit/4c8a627b2f663eff2ad608c659952bce10ec3a61
- https://github.com/feathersjs-ecosystem/feathers-vuex/commit/7615cdd37361307432798e44f0217af6a37275e0
🐜 A Cleaner Test Experience
In the process of adding the previously-mentioned feature, I (@marshallswain) was also able to track down the cause of hundreds of error messages occurring about five seconds after the tests ended. These error messages were really cluttering the console, making it difficult to see the actual test results. The culprit ended up being the test fixtures for the simulated/mocked Socket.io client. You can see the update here: https://github.com/feathersjs-ecosystem/feathers-vuex/commit/8d399fa10b1799b4c3c9ab5272c0d65b3d704bf6.
By the way, for anybody cloning the repo to contribute, you can easily debug tests with Visual Studio Code. The repo includes a launch.json file, which sets up a “Mocha Tests” script. Just select it in Code’s debug panel and press the play button. See how all of the tests pass! You can also set breakpoints to inspect variables in the tests. Neat!
🎉 Thank You!
We all really appreciate the awesome improvements that have been gifted to us by the community. I’ve been amazed at the contributions that have come in this year. Feathers-Vuex was made to make app building more fun. The Feathers and Vue communities have upgraded it to be a fantastic professional solution for building apps. It just keeps getting better! Thanks again!
