分享来自 quora 的一篇文章 https://www.quora.com/How-difficult-is-it-to-create-a-JavaScript-framework

https://code.tutsplus.com/tutorials/build-your-first-javascript-library--net-26796

This mostly depends on your JavaScript skills, but as you said, that you are using a lot of JavaScript it won't be that difficult...

There are two different words:
Library: Is a script, that supports you by completing some task(s)
Framework: Takes over everything and helps you to build the application from the first line of code till it is finished and creates lifecycles etc.

Creating the JavaScript Framework itself isn't that a difficult task. A much more difficult task though, is the design, you have to do before you actually start building the Framework.

Let's think, what would  the perfect JavaScript Framework be like?

  • Easy to use
  • Includes a router using the new HTML5 pushState function
  • Has it's own easy-to-use template engine, that also can load templates from the server
  • Loads models easily automated from the server when requested
  • Makes it easy to modularize the Controllers, that are used
  • Has it's own Message Bus System to easily trigger events (as well Events of the Framework as Events triggered by the Framework user)
  • Gives easy access to Cookie Setting and Server Communication (including Sockets)
  • Can save models on the client side with HTML5 database and filesystem features
  • Caches some server requests if told so (or even automated with some intelligent algorithm, to check whether a good idea to cache or not)
  • Makes it as easy as possible to create One-Page-Apps
  • Easy to use together with the PHP Laravel Framework or the Node.js Express Framework (sorry Ruby, i don't like you :) )
  • Easily extendable
  • Has a Life cycle, so that you are able to complete tasks before/after the Page Rendering/Model Loading/Unload etc.
  • Open Source
  • Compatible with most important JS libraries
  • Well documented (the most important thing at all and yes i know writing documentations is quite boring :) )

There are two approaches for creating any kind of apps:
The Model View Controller Approach(MVC):
(Source: http://www.wikipedia.de)
This Approach consist of Model Objects, that stores all the data of the Application, Views that define how the data should be viewed and Controllers, which yes you guess was right - Controllers the Views and Models, and define, when which function has to be executed.
An example for this type would be backbone.js (Although Backbone.js defines itself much more as a library than a framework)
And there is the Model View ViewModel Approach (MVVM):

(Source: http://www.wikipedia.de)
Here you have Data Bindings: For example you can bind a variable to a special <p> tag. Every time the Variable get's updated the paragraph will be updated as well.

I personally prefer the MVC approach, as it makes it a lot easier to create One-Page-Apps, as you don't simply bind your variables to one element in the HTML-Source, which makes it possible to have different UX types in your main content a lot easier.

Now here I will give you some tips for the design&building process:

  • Only use one global namespace for your whole Framework, this also makes it easier to be compatible with other libraries
  • Draw up all your objects on a paper (yes real paper it still exists and is a pretty good option for this), so you always have an overview about what classes you have, which ones still are missing etc.
  • Pack the whole thing in a require.js module
  • Use other libraries as a base for your framework (If it is about being productive and not doing it for the craic you don't have to reinvent the wheel)
  • Always have a list of bugs and new features next to you, and mix the different things you still have to do (don't just fix bugs for one day, that could be too boring and will make you loose the enthusiasm)
  • NEVER GIVE UP!

There are a lot of frameworks out there, but if you have the time to build your own you should do it - you will learn a lot if you do so.
And the more fun you have building it the less hard the work it is going to be for you.
Alright I hope I was able to help you out, if you have further questions don't bother to ask :)

How difficult is it to create a JavaScript framework?的更多相关文章

  1. best javascript framework list -- 最好的js框架

    Javascript Framework List | Top Javascript Framework List | Best Javascript Framework List http://co ...

  2. Create an Embedded Framework in Xcode with Swift

    转自:http://zappdesigntemplates.com/create-an-embedded-framework-in-xcode-with-swift/ Post Series: Cre ...

  3. Object.create 函数 (JavaScript)

    创建一个具有指定原型且可选择性地包含指定属性的对象. 语法 Object.create(prototype, descriptors) 参数 prototype 必需.  要用作原型的对象.  可以为 ...

  4. Javascript Framework Scenario

    Mobile----- zepto, jQuery Scroll------ iscrollhttp://cubiq.org/iscroll-4 jo.js widget----- jquery pl ...

  5. KISSY - A Powerful JavaScript Framework

    KISSY 是一款跨终端.模块化.高性能.使用简单的 JavaScript 框架.除了完备的工具集合如 DOM.Event.Ajax.Anim 等,它还提供了经典的面向对象.动态加载.性能优化解决方案 ...

  6. javascript framework vue.js

    vue.js 参考: http://cn.vuejs.org/guide/installation.html   不管使用何框架,首先都是要创建它的实例: var vue = new Vue({//参 ...

  7. javascript framework js常用框架

    js常用框架 一.node.js   二.angularjs.js   三.react.js   四.webpack.js   五.flux.js   六.vue.js   七.bootstrap   ...

  8. JavaScript资源大全中文版(Awesome最新版)

    Awesome系列的JavaScript资源整理.awesome-javascript是sorrycc发起维护的 JS 资源列表,内容包括:包管理器.加载器.测试框架.运行器.QA.MVC框架和库.模 ...

  9. 12款简化 Web 开发的 JavaScript 开发框架

    前端框架简化了开发过程中,像 Bootstrap 和 Foundation 就是前端框架的佼佼者.在这篇文章了,我们编制了一组新鲜的,实用的,可以帮助您建立高质量的 Web 应用程序的 JavaScr ...

随机推荐

  1. 详细,Qt Creator快捷键大全,附快捷键配置方法

    一.快捷键配置方法: 进入“工具->选项->环境->键盘”即可配置快捷键. 二.常用默认快捷键: 编号 快捷键 功能 1 Esc 切换到代码编辑状态 2 F1 查看帮助(选中某一类或 ...

  2. opatch auto in windows db in 11.2.0.4

    --prapare:copy 192.168.63.83 D:\oracle_patch\1612 to 192.168.2.169 D:\oracle_patch\1612cd D:\oracle_ ...

  3. 转: oracle 存储过程 执行动态 实现sql

    http://jingyan.baidu.com/article/5d6edee2fbb9f999eadeecb9.html http://jingyan.baidu.com/article/3638 ...

  4. ABI & API

    API defines the programning language and function entry point, arguments type, order. ABI defines th ...

  5. GCC: compilation process..

    gcc -Iproj/src myfile.c -o myfile gcc -c myfile.c "compile without linking gcc -D DEBUG myfile. ...

  6. Android自定义XML属性

    <?xml version="1.0" encoding="utf-8"?> <resources> <declare-style ...

  7. GB2312、Unicode编码等

    抛出问题: 我在CPP文件中,打算输出一行阿拉伯字符:

  8. 英文SEO外部链接资源收集之常用的footprints

      inurl:/privacy-policy "Using Article Directory plugin"inurl:/terms "Using Article D ...

  9. hdu_5719_Arrange(脑洞题)

    题目连接:hdu_5719_Arrange 题意: 给你1-n这 n个数,设一个排列的第i个数为Ai, Bi为A1到Ai的最小值,Ci为C1到Ci的最大值,问你有多少种排列方式,然后输出取模后的答案 ...

  10. meta--------link

    <meta http-equiv="refresh" content="20">//每二十秒刷新一次页面: <meta http-equiv= ...