🎁 Better Error Messaging, Bulk Event Batching, Improved Store Customization
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 `getFromStore` from undefined.
New error messages will now get right to the specifics of the problem, letting you know that the model option is missing. Thank you, @JorgenVatle!
Here's the original PR: #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 for 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: #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, mutations, and 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 together.
Here are the commits where the magic happened:
🐜 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: 8d399fa.
By the way, for anybody cloning the repo to contribute, you can easily debug tests with Visual Studio Code. Included in the repo is a launch.json file which sets up VS Code with a "Mocha Tests" script. Just select it and press play and you can watch the tests run. You can also set breakpoints to inspect variables in the tests. Neat!