简介

QingKuai 为自中文“轻快”的拼音,使用此名称是因为它具有 量级、 响应以及更加 轻快 的开发体验为核心的特点。它是一个用于构建 web 界面及交互功能的框架,它提供了一套变量响应化以及界面组件化的编程模型,并使用编译器将 qk 文件源码转换为极简、高效且严格优化的 js 代码。

在编写组件时,可以将脚本和样式写在嵌入语言标签中,脚本嵌入语言标签有 lang-js 和 lang-ts,样式嵌入语言标签有 lang-css,lang-scss,lang-less,lang-stylus 以及 lang-postcss,除此之外的任意位置都是书写 HTML 模板代码的地方。下面是一个最基本的使用示例:

qk
<lang-js>
    const name = "World"
</lang-js>

<h1>Hello {name}!</h1>

<lang-css>
    h1 {
        color: red;
    }
</lang-css>

需要注意的是 scriptstyle 标签中的代码不会受编译器影响,它们的原始内容会被保留并插入页面(即与普通 HTML 中表现一致):

qk
<style>
    /* 向HTML中插入同样内容的style标签 */
</style>

<script>
    /* 向HTML中插入同样内容的script标签 */
</script>

设计理念

qingkuai 的设计理念是尽可能少造新语法,优先采用现有主流框架的语法习惯,只有在现有设计存在明显不合理之处时,才会做出必要的调整。这一理念旨在最大程度地降低学习成本,使开发者能够快速上手并专注于业务本身。

不使用 scriptstyle 作为嵌入语言标签并不简单的是为了突出 qingkuai 的个性化,而是出于实际的兼容性考虑:当这些标签包含多个属性并被换行时,会导致基于 Textmate 的语法高亮功能失效:

html
<style
    scoped
    lang="scss"
>
    /* 此处不能正确高亮scss */
</style>
如果你使用过 vuesvelte,会发现 qingkuai 的模板语法在许多方面与其相似,这是在设计时特意保留的,目的正是为了降低学习成本。但在语法相似的背后,qingkuai 的编译产物以及运行时实现却与其他框架是截然不同的。

为何选择 ​QingKuai?

与目前流行的前端框架相对比,qingkuai 具有一些核心优势:

在github上编辑此页面