Well, there will be time for a more thorough look later, but one of the first things that is apparently lost is the convenience of the debounce function. This was a very nice, very convenient function to collapse multiple calls into one, something that very easily happens with data bindings firing an event for every single user action (e.g. character entered in text field). The new syntax is fairly long, but luckily for us, there are ways to get it back.
I will go through two methods for debounce. First, I will go through the new, Polymer 2 API for Debounce, and then I will show the bundled “legacy” API that adds the convenient API back in.
LegacyMixin = function(superClass) {
return class extends superClass {
constructor() {
super();
this.__lmDebouncers = {};
}
debounce(key, fn, timeout) {
this.__lmDebouncers[key] = Polymer.Debouncer.debounce(
this.__lmDebouncers[key],
timeout > 0 ? Polymer.Async.timeOut.after(timeout) : Polymer.Async.microTask,
fn.bind(this)
);
}
}
};
That’s the easy copy-paste version. Let’s run through and see what we’re actually doing.
First, we create this.__lmDebouncers = {}; which will store a map of key-value pairs. The new array is needed to store the debouncers, as Polymer.Debouncer.debounce() now accepts three arguments:
- Object: An instance of Polymer.Debouncer (to cancel). Can be null.
- Polymer.Async.timeOut: An instance of a wrapped timeout
- The callback function, which already must be bound
As can be seen, the rest of the code simply wraps around the new, longer function call. We can include the shorter version if we only need the new code.
Another option is to use Polymer.LegacyElementMixin, which ships by default with Polymer 2. This must of course be imported, and has a net effect of adding back in all of the older Polymer APIs onto the new element, including the debouncer calls, as well as the new mixins of GestureEventListeners and ElementMixin.
It is unclear to me why some of these methods, such as debounce, have been relegated to legacy status when the functionality is there. At least there’s the option of getting them back.