It’s been five months since the last significant Knockout release, so it’s about time for another! The core team and many contributors have been hard at work adding some sweet new features, performance upgrades, architectural improvements, and bug fixes. After all this, the final code file is smaller than the previous version
The theme for KO 2.2.0 was “all the small things”. We processed and closed many, many, many work items tracked on GitHub, fixed a bunch of niggly little issues, improved our code structure, and put in some enhancements we’ve been wanting for a while.
My favourite enhancement is that the foreach binding will now detect when you have reordered elements in an array, and will simply move the corresponding DOM elements into the new order (previously, a “move” was handled as an “add” and a “delete”). You don’t have to change your code to enable this – it just works, even if you’re moving, adding, and deleting multiple items as a single atomic operation. Example:
If you want to animate the movements of DOM nodes into their new positions, you can make use of the new beforeMove and afterMove callbacks.
We’ve also made some features work more like you might always have thought they should work. For example, the css binding can now attach programmatically-generated CSS class names to elements (previously, it was limited to toggling predefined CSS class names). Example:
Other improvements include:
- The with, if, and ifnot bindings have been enhanced to preserve their original DOM elements on initial binding, so they are lighter and won’t unnecessarily strip out any special behaviours inserted by third-party libraries. I know a lot of people asked for this.
- The dependency detection mechanism is now smarter in many places to avoid registering subscriptions that would be unnecessary no-ops
- Support for IE10 (well, we basically already supported it, but there was one edge-case issue with autocompletion that we fixed)
- Improved AMD support (the ko variable is now available in the context of all custom binding handlers, even if it isn’t in global scope)
- The text binding can now be used in a virtual element (e.g., <!--ko text: myValue--><!--/ko-->)
- Observable and computed properties have a new peek function for advanced control over dependency detection
Big thanks to Michael Best and Ryan Niemeyer – my fellow KO core team members – and the many community members who contributed features, specs, and clearly-reproducible bug reports