前端框架整理

前端框架 - 幕布

前端框架

 

• Cash
  • 適用於現代瀏覽器的荒謬的jQuery替代品
    • Cash是現代瀏覽器（IE11 +）的一種荒謬的jQuery替代方案，它提供了jQuery樣式的語法來處理DOM。利用現代瀏覽器功能來最小化代碼庫，開發人員可以在文件大小的一小部分使用熟悉的可鏈接方法。與jQuery達到100％的功能均等並不是一個目標，但是Cash很有幫助，涵蓋了大多數日常用例。
    • https://github.com/kenwheeler/cash
• Zepto
  • 用於現代瀏覽器的極簡JavaScript庫，具有與 jQuery兼容的API。 如果您使用jQuery，您已經知道如何使用Zepto。
    • 雖然100％的jQuery覆蓋率不是設計目標，但提供的API與jQuery對應的API匹配。我們的目標是擁有一個約5-10k的模塊化庫，並通過 熟悉且通用的API 快速下載並執行，因此您可以專注於完成工作。
    • https://zeptojs.com/
• mpvue
  • http://mpvue.com/
  • 一個使用 Vue.js 開發小程序的前端框架。框架基於 Vue.js 核心，mpvue 修改了 Vue.js 的 runtime 和 compiler 實現，使其可以運行在小程序環境中，從而為小程序開發引入了整套 Vue.js 開發體驗。
• getuikit
  • 一款輕量級、模塊化的前端框架可快速構建強大的web前端界面
  • http://getuikit.net/
  • http://getuikit.net/docs/core.html
  • https://github.com/uikit/uikit
• 所有演示應用程序之母
  • “所有演示應用程序之母” —由React，Angular，Node，Django等提供支持的示例性全棧Medium.com克隆
  • https://github.com/gothinkster/realworld
• 一個高效，可表達，可擴展的HTML模板庫，用於JavaScript
  • Efficient, Expressive, Extensible HTML templates in JavaScript
  • https://lit-html.polymer-project.org/
  • https://github.com/Polymer/lit-html
• 輕量、簡單、好用、靈活的 MVVM 框架。
  • https://yoxjs.github.io/yox/#/
• Minimal templating on steroids
  • 它使用模板和輸入對象來生成HTML或其他文本格式。車把模板看起來像帶有嵌入的車把表達式的常規文本。
  • https://handlebarsjs.com/
• AppRun
  • AppRun是一個JavaScript庫，用於使用Elm啟發的體系結構，事件和組件來構建可靠的高性能Web應用程序。
  • AppRun is a JavaScript library for building reliable, high-performance web applications using the Elm inspired Architecture, events, and components.
  • https://apprun.js.org/
  • https://github.com/yysun/apprun-site
  • https://github.com/yysun/apprun
• Storybook是一個開源工具，用於為React，Vue和Angular隔離開發UI組件。它使構建令人驚嘆的UI變得井井有條，高效。
  • 更快地構建防彈UI組件
  • https://github.com/storybookjs/storybook
  • https://storybook.js.org
• Material UI 是一套實現了 Google 的 Material Design 全新設計語言的 CSS 框架
  • React components that implement Google's Material Design
  • https://material.io/design/introduction
  • https://reactjs.org
  • https://gitee.com/mirrors/Material-UI
• React
• Angular
• Vue
• Ember
• Web Components
• Meteor
• Blaze
• Vanilla JS
• Next.js
• https://material.io/design/
• Material Components
  • Svelte 3的Material UI組件，可以在您的應用程序中使用
  • https://material.io/components
  • https://getmdl.io/components/index.html
  • https://sveltematerialui.com
• 適用於網絡的模塊化和可自定義的Material Design UI組件
  • https://github.com/material-components/material-components-web
•  lowdb是由Lodash支持的小型本地JSON數據庫（支持Node，Electron和瀏覽器）
  • https://github.com/typicode/lowdb
• 讓MVVM跨端環境大統一
  • 真正專注於讓一套代碼運行多端的開發框架，提供標准的MVVM架構開發模式統一各類終端
  • https://cmljs.org/#/
• Web的自動化審核，性能指標和最佳實踐
  • Lighthouse分析Web應用程序和網頁，收集現代性能指標以及對開發人員最佳實踐的見解
  • https://github.com/GoogleChrome/lighthouse
• 鍵入時設置輸入文本內容的格式
  • Cleave.js的目的很簡單：幫助您自動設置輸入文本內容的格式。
  • https://nosir.github.io/cleave.js/
  • https://github.com/nosir/cleave.js/
• 下一代塊樣式編輯器。 免費。 使用樂趣。
  • Editor.js是用於富媒體故事的塊樣式編輯器。它以JSON而非干凈的HTML標記輸出干凈的數據。更重要的是，Editor.js設計為可擴展和可插入API。
  • Next generation block styled editor.Free. Use for pleasure.
  • https://editorjs.io
• Squeezer Framework-構建無服務器dApp
  • Squeezer是一個平台，可讓新進入的區塊鏈開發人員輕松構建無服務器的dApp。
  • https://github.com/SqueezerIO/squeezer
• 時尚，模塊化的開源JavaScript文件上傳器
  • Uppy可以從本地以及從Dropbox或Instagram等遠程位置獲取文件。憑借其無縫集成，可靠性和易用性，Uppy確實是您文件上傳的最佳朋友。
  • https://uppy.io/
  • Uppy是一個時尚且模塊化的文件上傳器。它從本地磁盤，Google雲端硬盤，Instagram，遠程URL，照相機等獲取文件，然后將它們上傳到最終目的地。它快速，易於使用，並且讓您比構建文件上傳器更擔心更重要的問題。
  • https://uppy.io/docs/
  • https://github.com/transloadit/uppy/
  • Web瀏覽器的下一個開源文件上傳器
  • Uppy是一個時尚，模塊化的JavaScript文件上傳器，可與任何應用程序無縫集成。它快速，易於使用，並且讓您比構建文件上傳器更擔心更重要的問題。
• Zero configuration web framework.
  • https://zeroserver.io/?#getting-started
• A fast, small-but-mighty, familiar fish...errr, router*
  • https://github.com/lukeed/trouter
• 極速零配置Web應用打包工具
  • https://parceljs.org/
  • https://webpack.js.org/
• Polka是極少的高性能Express.js替代產品。是的，你說得對，Express是已經超快＆不是那個大🤔 -但是Polka顯示（以某種方式）有改進的空間！
  • Polka is an extremely minimal, highly performant Express.js alternative. Yes, you're right, Express is already super fast & not that big 🤔 — but Polka shows that there was (somehow) room for improvement!
  • https://github.com/lukeed/polka
• svelte-mui
  • Simple Svelte 3 UI components
  • https://github.com/vikignt/svelte-mui
• svelte
  • 強的Web應用程序
  • Svelte是一種全新的構建用戶界面的方法。像React和Vue這樣的傳統框架會在瀏覽器中完成大部分工作，而Svelte會將其轉變為在構建應用程序時發生的編譯步驟。
  • Svelte不會使用虛擬DOM差異之類的技術，而是編寫可在您的應用程序狀態更改時通過外科方式更新DOM的代碼。
  • Svelte是構建Web應用程序的新方法。這是一個使用聲明性組件並將其轉換為有效JavaScript的編譯器，可通過外科方式更新DOM。
  • https://svelte.dev
  • https://sapper.svelte.dev
  • https://github.com/sveltejs/svelte
  • 目的
    • 靜態編譯，無需引入框架自身
    • 一個 Svelte 組件是靜態編譯，所有需要的運行時代碼都包含在里面了，除了引入這個組件本身，你感覺不到框架存在。
    • 編寫更少代碼
    • svelte 模板提供一些簡便的用法，在維護和編寫上都變得更簡單，代碼量更少（維護的代碼），這些模板會編譯為最終的js 代碼。
    • 只會打包使用到的代碼
    • 即 tree shaking，這個概念本來也是作者首先提出來的，webpack 是參考了 rollup。
    • 無需虛擬 DOM 也可進行響應式數據驅動
    • 更便捷的響應式綁定
    • 既有響應式數據的優點，v3 版本也解決了 vue 數據綁定缺點，用起來十分方便。
• quasar
  • https://github.com/quasarframework
  • https://quasar.dev
  • Build high-performance VueJS user interfaces in record time
  • Build responsive Single Page Apps, SSR Apps, PWAs, Hybrid Mobile Apps and Electron Apps, all using the same codebase!, powered with Vue.
  • https://quasar.dev/
  • https://github.com/quasarframework/quasar
  • https://quasar.dev/start/pick-quasar-flavour
• browserify
  • browserify plugin for riot files
  • https://github.com/riot/rollup-plugin-riot
  • https://github.com/riot/riotify
• riot
  • Riot為所有現代瀏覽器帶來了自定義組件。它旨在為您提供Web組件API原生的所有功能。
  • Simple and elegant component-based UI library 
  • https://github.com/riot/riot
  • https://riot.js.org/
  • https://github.com/riot/examples
  • https://riot.js.org/documentation
• Mithril
  • Mithril is a modern client-side JavaScript framework for building Single Page Applications. It's small (< 10kb gzip), fast and provides routing and XHR utilities out of the box.
  • Mithril是用於構建單頁應用程序的現代客戶端JavaScript框架。它體積小（<10kb gzip），速度快，並提供開箱即用的路由和XHR實用程序。
  • https://mithril.js.org/index.html
• hyperapp
  • The tiny framework for building web interfaces. 
  • https://hyperapp.dev/
  • https://github.com/jorgebucaran/hyperapp
• Inferno
  • Inferno is an insanely fast, React-like library for building high-performance user interfaces on both the client and server.
  • Inferno是一個快速，類似於React的庫，用於在客戶端和服務器上構建高性能的用戶界面。
  • https://github.com/infernojs/inferno
  • https://github.com/infernojs
  • https://infernojs.org/docs/guides/installation
• https://webcomponents.dev/
• omi
  • https://codepen.io/omijs/pen/PMZWNb
  • 前端跨框架跨平台框架
    • 將Web組件，JSX，虛擬DOM，功能樣式，觀察或代理合並到一個體積很小且具有高性能的框架中。一次編寫組件，在任何地方都可以使用，例如Omi，React，Preact，Vue或Angular。
    • http://tencent.github.io/omi/
    • https://github.com/Tencent/omi
    • https://tencent.github.io/omi/site/docs/index.html
  • Build cross platform desktop apps with Omi.js and Electron.js 基於Omi.js和Electron.js構建跨平台的桌面應用
    • https://github.com/Wscats/omi-electron
  • https://tencent.github.io/omi/packages/omim/docs/build/cn.html#/text-field?index=6&subIndex=0
• NoahV
  • NoahV是一個基於vue開發的前端開發框架，主要適用於監控運維、數據分析等場景，同時也適用於常見的后台管理系統
  • https://baidu.github.io/NoahV/#/guide/about
• Vue.js
  • Vue.js是一套構建用戶界面的漸進式框架。與其他重量級框架不同的是，Vue 采用自底向上增量開發的設計。
  • Vue 的核心庫只關注視圖層，並且非常容易學習，非常容易與其它庫或已有項目整合。
  • 另一方面，Vue 完全有能力驅動采用單文件組件和Vue生態系統支持的庫開發的復雜單頁應用。
  • http://cn.vuejs.org/
• Mint UI
  • mint-ui 是有餓了么前端團隊推出的基於Vue.js的移動端組件庫，Mint UI 包含豐富的 CSS 和 JS 組件，能夠滿足日常的移動端開發需要。
  • 通過它，可以快速構建出風格統一的頁面，提升開發效率。真正意義上的按需加載組件。可以只加載聲明過的組件及其樣式文件，無需再糾結文件體積過大。
  • 官網：http://mint-ui.github.io/#!/zh-cn
• Element
  • Element，一套為開發者，設計師和產品經理准備的基於Vue 2.0的桌面端組件庫，是餓了么前端開源維護的Vue UI組件庫,組件齊全，基本涵蓋后台所需的所有組件
  • 官網：https://element.eleme.cn/#/zh-CN
• iView
  • iView 是一套基於 Vue.js 的開源 UI 組件庫，主要服務於 PC 界面的中后台產品。
  • 其特性為高質量、功能豐富、友好的 API ，自由靈活地使用空間、細致、漂亮的 UI、事無巨細的文檔、可自定義主題
  • 官網：http://v1.iviewui.com/
• Vant
  • Vant輕量、可靠的移動端 Vue 組件庫特性 60+ 高質量組件、 95% 單元測試覆蓋率、完善的中英文文檔和示例、支持按需引入、支持主題定制、支持國際化、支持TS、支持SSR等。
  • 官網：https://youzan.github.io/vant/#/zh-CN/intro
• Layui
  • Layui 定義為“經典模塊化”，並非是刻意強調“模塊”理念本身，而是有意避開當下 JS 社區的主流方案，試圖以盡可能簡單的方式去詮釋高效！
  • Layui 提供了豐富的內置模塊，他們皆可通過模塊化的方式按需加載。
  • Layui可作為 PC網頁端后台系統與前台界面的速成開發方案。
  • 官網：https://www.layui.com/
• uni-app
  • uni-app是一個使用Vue.js開發所有前端應用的框架，開發者編寫一套代碼，可發布到iOS，Android，H5，以及各種小程序（微信/支付寶/百度/頭條/ QQ /釘釘）等多個平台。
  • 即使不跨端，uni-app同時也是更好的小程序開發框架。
  • 官網：https://uniapp.dcloud.io/
• Ant Design
  • Ant Design是基於 Ant Design 設計體系的 React UI 組件庫，主要用於研發企業級中后台產品。
  • Ant Design服務於企業級產品的設計體系，基於確定和自然的設計價值觀上的模塊化解決方案，讓設計者和開發者專注於更好的用戶體驗。
  • 官網：https://ant.design/index-cn
• reactjs
  • https://reactjs.org.cn/
  • https://reactjs.org/
  • https://preactjs.com/