snabbdom 介绍
虚拟DOM很棒。它允许我们将应用程序的视图表示为状态的 函数 。但是现有的 解决方 案太过膨胀,太慢,缺少 功能 ,API偏向OOP和/或缺少我需要的 功能 。?
介绍
Snabbdom由 一个 非常简单,高 性能 和可扩展的内核组成,仅约200 SLOC。它提供了具有丰富 功能 的模块化体系结构,可以通过 自定义 模块进行扩展。为了使核心保持简单,所有非必要 功能 都委托给模块。
您可以将Snabbdom塑造成您想要的任何东西!选择,选择和定制所需的 功能 。或者,您可以只使用 默 认扩展名,并获得具有高 性能 ,小尺寸和下面列出的所有 功能 的虚拟DOM库。
特征
核心 功能 大约200个SLOC –您可以轻松阅读整个核心,并完全了解它的工作原理。通过模块可扩展。每个vnode以及模块的全局可用的丰富钩子集可以钩入diff和patch过程的任何部分。出色的表现。Snabbdom是Virtual DOM Benchmark中最快的虚拟DOM库之一。具有等效于缩小/扫描 功能 的 功能 签名的修补 功能 。可以更轻松地与FRP库集成。模块中的 功能 h 用于轻松创建虚拟DOM节点的 功能 。SVG 只能与h助手一起使用。用于执行复杂css动画的 功能 。强大的事件监听器 功能 。Thunk进一步优化了差异和补丁过程。第三方 功能 借助snabbdom-pragma来 支持 jsX?。snabbdom-to-html提供的服务器端html 输出 。使用snabbdom-helpers进行紧凑的虚拟DOM创建。使用snabby 支持 模板字符串。具有虚拟外观的虚拟DOM断言实例
var snabbdom = require('snabbdom');var patch = snabbdom.init([ // Init patch function with chosen modulesrequire('snabbdom/modules/class').default,// makes it easy to toggle classesrequire('snabbdom/modules/props').default,// for setting properties on DOM elementsrequire('snabbdom/modules/style').default,// handles styling on elements with support for animationsrequire('snabbdom/modules/eventlisteners').default,// attaches event listeners]);var h = require('snabbdom/h').default; // helper function for creating vnodesvar container = document.getElementById('container');var vnode = h('div#container.two.classes',{on: {click: someFn}},[h('span',{style: {fontWeight: 'bold'}},'This is bold'),' and this is just nor mal text',h('a',{props: {href: '/foo'}},'I'll take you places!')]);// Patch into empty DOM element – this modifies the DOM as a side effectpatch(container,vnode);var newVnode = h('div#container.two.classes',{on: {click: anotherEventHandler}},{style: {fontWeight: ' nor mal',fontStyle: 'italic'}},'This is Now italic type'),' and this is still just nor mal text',{props: {href: '/bar'}},'I'll take you places!')]);// Second `patch` invocationpatch(vnode,newVnode); // Snabbdom efficiently updates the old view to the new state// to unmount from the DOM and clean up,simply pass nullpatch(newVnode,null) 链接 : http://www.fly63.com/nav/2798GitHub: https://github.com/snabbdom/snabbdom
网站描述: 一个 虚拟的DOM库专注于简化,模块化拥有强大的 功能 和 性能
snabbdom官方网站
官方网站:
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://www.haodehen.cn/did175576