Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
backbone.vdomview
Advanced tools
Changelog
1.0.1 (2018-01-29)
dist
version for older browsers.Readme
This library provides a VirtualDOM-aware Backbone View, called
Backbone.VDOMView
.
It depends on snabbdom for the virtual-DOM implementation.
To use it, extend Backbone.VDOMView
. Then, instead of implementing a render
method in your view, add a toHTML
method which returns the View's HTML as a
string.
The HTML of the toHTML
must be structured so that there's a root element
containing everything else. This root element is the view's top-level element,
in other words, it's the DOM node represented by the this.el
or this.$el
attribute of the View.
React has a similar requirement that JSX returned by a component's render
method
should have a root node which contains everything else.
The rest will then be handled by VDOMView
, which will automatically
generate a diff between the view's current DOM element and new virtual-DOM
node and then patch the actual DOM with this diff.
For example:
const MyView = Backbone.VDOMView.extend({
tagName: 'span',
className: 'vdom-span',
toHTML () {
return this.template(_.assign(this.model.toJSON()));
}
});
One important difference between Backbone.VDOMView
and Backbone.View
that should be noted is that the HTML being rendered (in the case of
Backbone.VDOMView
this is done in the toHTML
method) should include
the root element of the view.
So in the example above toHTML
should return <span class="vdom-span"> ... </span>
as the outer part of the HTML string.
This is different from normal Backbone.View classes, where your template will only return the inner part of the view element.
Snabbdom implements non-core functionality in separate modules.
Backbone.VDOMView makes use of all Snabbdom's modules except for the
eventlisteners
module.
The eventlisteners
module allows you to add event listeners
when creating a virtual node via the h
method.
However Backbone.VDOMView doesn't use the h
method of Snabbdom at all (it
doesn't even include the code for it). Instead, it expects you to render the
HTML for the view in the toHTML
method, for example by using an underscore or
lodash template.
There's therefore no way to attach these event listeners.
This way of registering event listeners is also in contrast to Backbone's declarative way of registering events, which is more the "Backbone way".
Backbone.VDOMView will make sure that these declaratively registered event listeners will remain active whenever the View's DOM representation changes.
Backbone.VDOMView
will call two lifecycle methods (if they exist).
These are beforeRender
and afterRender
and are respectively called
before and after toHTML
is called.
Backbone can be used without jQuery by using Backbone.NativeView instead of Backbone.View.
If Backbone.NativeView is available, then the VDOMView will use that instead of Backbone.View.
Backbone.VDOMView
is used in converse.js.
If you have any questions, feel free to create an issue or contact me directly.
FAQs
VirtualDOM-aware Backbone View
The npm package backbone.vdomview receives a total of 19 weekly downloads. As such, backbone.vdomview popularity was classified as not popular.
We found that backbone.vdomview demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.