PowJS 更新至 2.2.0,Real-DOM 模板引擎创始者

综合技术 2018-05-18 阅读原文

PowJS 2.2.0 已发布,PowJS 是一个 ECMAScript 6 编译型 Real-DOM 模板引擎.

Real DOM 直接在 DOM Tree 上编译, 渲染. DOM Tree 就是模板.
原生语法 指令与 ECMAScript 原生语法对应
导出视图 采用 ECMAScript 源码
属性插值 name="something {{expr}}"
文本插值 剔除文本节点两端空白后对 {{expr}} 进行插值
缺省形参 顶层缺省形参为 (v, k)
形参传递 除非使用 param 指令, 子层继承上层的形参

只有 15K 的单文件实现模板的编译, 导出, 渲染, 一切都在真实的浏览器环境进行.

写模板就像写 JS 函数, 直视 My Folders 半成品, 自己动手完成事件和样式.

HTML string ---> Real DocumentFragment
                   |
                   V
Real Node   ---> PowJS  View
                   |
                   V
                 render(...args)
                   |
                   V
                 Real DocumentFragment ---> Real DOM

```

install

NodeJS 环境

yarn add powjs

浏览器环境

Change Log

该项目遵循 Semantic Versioning

2.2.0

  • 修复 exports 导出 BUG

  • 优化 toString 输出

  • 变更 if 指令取消尾部 || 规则, 优化为尾部 ; 判断

  • 增加 each 附加参数以及形参推导

2.1.1

  • 修复 each 形参推导 BUG

2.1.0

  • 修复 if 指令未能正确处理 #text string 的 BUG

  • 变更 isRoot 的判断算法, 为实时渲染提供基础

  • 增加 func 指令命名视图, 支持视图调用

  • 增加 形参推导, 参见 each-render 小节

  • 增加 isReal 返回当前节点是否连接到真实的页面 DOM 中

2.0.0

  • 变更 环境 ECMAScript 6

  • 变更 指令 if 融合渲染条件和可变标签

  • 变更 插值使用模板字符串 ${x}

  • 变更 toScript() 格式, 支持多节点模板

  • 变更 模块入口参数 option 格式

  • 移除 required(), outerHTML(), node(), view

  • 增加 多节点模板支持: Node,[Node],NodeList

  • 增加 属性 node, 当前渲染的节点

  • 增加 辅助方法 prop(propertyName[,v])

  • 增加 辅助方法 exports(target),lastChild(),isRoot(),query(selector)

  • 增加 节点操作 appendTo(node),renew(node),insertBefore(node),insertAfter(node)

1.1.0

  • 增加 .outerHTML 和插件支持

1.0.0

  • 第一个可用版本

开源中国

责编内容by:开源中国阅读原文】。感谢您的支持!

您可能感兴趣的

React 16 Jest ES6 Class Mocks(使用ES6语法类的模拟) 实例三、四... 项目初始化 git clone https://github.com/durban89/webpack4-react16-reactrouter-demo.git cd webpack4-react16-reactrouter-demo git fetch origin gi...
ES6小册子–解构赋值 这是ES6小册子的第五篇文章,今天给大家带来的是《解构赋值》。解构赋值作为ES6的一个新特性,它有什么强大的作用呢?今天就和大家介绍一下。 1.解构赋值赋值是什么 解构赋值是通过结构化的数据给变量赋值的形式,可以通过对象或者数组对多个变量进行赋值。它的基本形式是这样的: let a...
Type error – is not it a constructor This question already has an answer here: ES6+ javascript module export options 3 answers Wanted to instantiate a module within E...
Using ES6 Generators to generate keys in React Using ES6 Generators to generate keys in React A few days back I started reading up on ES6 generators (or generator functions), a new feature th...
ES6学习笔记 篇零 变量声明 本文是一系列就阮一峰大神的《 ECMAScript 6 入门 》的学习笔记。 附上原书(纸质版本及电子书版本都有)的购买地址 ES6标准入门(第2版) amazon ES6标准入门(第2版) jd ...