1. vdt
A template engine based on virtual dom library misstime
vdt
Package: vdt
Created by: Javey
Last modified: Fri, 15 Mar 2024 06:12:36 GMT
Version: 3.0.33
License: MIT
Downloads: 607
Repository: https://github.com/Javey/Intact

Install

npm install vdt
yarn add vdt

Vdt.js

npm version
Build Status

一个基于虚拟DOM的模板引擎,详情请访问:Documents

Benchmark

功能特性

  • 基于虚拟DOM,更新速度快
  • 支持模板继承,包含,宏定义等功能
  • 文件大小在gzip压缩后大概13KB(包含浏览器实时编译模块)
  • 支持前后端渲染

安装

 npm install vdt --save

示例

 <div>
    <h1>{title}</h1>
    <div ev-click={onClick.bind(self)}>Clicked: {count}</div>
    <ul v-for={items}>
        <li>{key}: {value}</li>
    </ul>
</div>
 var vdt = Vdt(template);
var dom = vdt.render({
    title: 'vdt',
    items: {
        a: 1,
        b: 2
    },
    count: 0,

    onClick: function() {
        this.count++;
        vdt.update();
    }
});

document.body.appendChild(dom);

相关库

  1. misstime vdt基于的virtual dom库
  2. Intact 基于vdt的mvvm框架
  3. vdt-loader vdt模板文件的webpack loader

基准测试

See Benchmark

许可

MIT

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code