knockout-spa单页应用框架

联合创作 · 2023-09-19 11:45

Knockout, Require, Director, jQuery, Sugar搭建的单页程序(SPA Single Page Application)框架。

特征

  • 快速,轻巧(缩小了100 KB的JS,并压缩为初始内核设置)。
  • 使用Knockout 3.4.0+,可以使用Knockout的Web组件和自定义标签
  • 提供Knockout ES5 POJO样式的viewModel / binding选项,以帮助您编写更简洁的代码,并使将来更轻松地用其他MVVM库替换Knockout。
  • 对生产使用2层捆绑包构建策略:大多数页面将使用的通用模块,以及将延迟加载的特定于页面的模块。这使应用程序可以扩展到非常大的规模-无需在第一页加载时一次性为整个应用程序一次性打包巨型捆绑文件-只会加载页面所需的部分,以及所有模块的公共依赖项。当用户导航到应用程序的其他部分时,所需的文件(js,css,html)被延迟加载。这对于应用程序的性能表现尤其重要,尤其是在移动设备上,因为一次性打包文件不仅由于大小而下载速度较慢,而且解析速度也较慢。
    • 使用require-cssrequire-textAMD插件可以按需动态加载CSS和HTML模板以及需要它们的JS模块;这些CSS和HTML模板文件将内联并缩小到相应的JS模块中,以进行生产构建。
  • 使用require-i18n可扩展的国际化/本地化。
  • 在开发过程中不需要任何观察程序/编译器/构建任务-您可以直接调试在IDE中编辑的完全相同的JS / CSS / HTML /任何文件。对文件所做的更改将在刷新浏览器后立即反映出来(或使用Chrome devtools工作区或类似工具无需更改页面即可实时呈现更改)。生产所需的唯一构建任务是RequireJS r.js优化器任务,该任务已在中预定义build.js。只需找出一种基于配置的方式即可从/build文件夹中提供资产以进行生产。
  • 路由(基于FlatironDirector:HTML5历史记录(pushState)或哈希。
  • 高度可组合和可重用:在页面特定的JS中为页面选择模块/组件,它们将自动连接到页面的HTML模板。
  • SEO准备就绪(prerender.io)。
  • 组织的文件夹结构可帮助您保持理智,以组织和重用模块/文件。不使用该文件类型的文件夹的结构,如/js/css/html/template,等等,作为属于同一模块/部件文件更容易当相同的文件夹下组合在一起进行导航。如果应删除应用程序的一部分,从理论上讲,您只需要删除相应的module / component文件夹,然后触摸很少的其他位置即可。
浏览 6
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报