7个优秀的国内外移动端web框架(转)
淘宝SUI Mobile框架 (light7框架 官网:http://www.light7.cn/)
官网地址:http://m.sui.taobao.org/
SUI Mobile 是一套基于 Framework7 开发的UI库。它非常轻量、精美,只需要引入我们的CDN文件就可以使用,并且能兼容到 iOS 6.0+ 和 Android 4.0+,非常适合开发跨平台Web
App。
轻量的UI库
SUI Mobile 非常轻量,核心库压缩Gzip后的JS、CSS网络传输体积总共只有52K,却提供了20+个常用的组件。
对于只有HTML&CSS的组件,你只需要复制HTML代码既可以使用。他的大部分JS组件都是独立的 Zepto 插件,并且提供了 Zepto/jQuery 风格的API,你将会非常熟悉这种方式。
移动端web框架 Frozen UI
官网地址:http://frozenui.github.io/
Frozen UI是一个开源的简单易用,轻量快捷的移动端UI框架。基于手Q样式规范,选取最常用的组件,做成手Q公用离线包减少请求,升级方式友好,文档完善,目前全面应用在腾讯手Q增值业务中。
非手Q用户不能使用离线包而直接请求核心css也仅28k,另外也可以采用cdn和combo的方式按需加载。
CSS组件包括按钮,列表,表单,通知,提示条,弹出框,选项卡,等级图标,角标,红点,1px解决方案等。
CSS使用模块化的样式命名和组织规范,使用sass编写css代码。
FrozenJS 是针对移动端开发的 js 组件库,其依赖 zepto.js 和 FrozenUI,支持seajs模块化和非模块化两种方式。
FrozenJS 包括: basic:FrozenJS 的一些基础功能,包括模板引擎、tap 支持等。 ui:主要是一些触屏常用的 UI 组件,包括 dialog 等。 effect:非常用的特效库,特殊场景使用到是可以单独调用。
兼容android 2.3 +,ios 4.0 + 。
移动WebApp开发框架 Clouda
官网地址:http://clouda.baidu.com/
Clouda是基于node.js的Webapp开发框架,在使用Clouda时需要安装node.js和MongoDB。
Clouda
是百度推出的一款面向资深开发者的WebApp开发框架。在Clouda中开发app,可以在多终端下实现数据同步、任务迁移。并且Clouda支持面向数据的编辑模式,根据数据的变化自动实现界
面实时更新,开发者不需描述跃迁过程。它的核心在于云、端使用统一的Javascript语言,可以同时运行在浏览器、iOS、Android以及百度框中。另外,clouda
app可以同时开发服务端和客户端,客户端的数据与云端实时同步,其内部数据也可供搜索引擎检索,解决app孤岛以及99.9%长尾应用只有30%分发量 的搜索分发问题。
HTML
移动端框架 Framework7
官网地址:http://framework7.io/
Framework7 或者叫 F7 是全功能的绑定 iOS 7
应用的 HTML 框架。Framework7 是免费开源的 HTML 移动端框架,用来开发混合移动端应用或者 iOS 7
的 Web 应用,并且带有 iOS 7
的原生外观和感觉。Framework7 也是独立的原型应用工具。
Framework7 使用 Javascript,CSS
和 HTML 来创建 iOS 7
应用,支持多个平台的迁移(PhoneGap),但是不是支持所有平台,主要还是针对 iOS 7。
Amaze UI框架
官网地址:http://amazeui.org/
Amaze UI 开发思路
通过拆分、封装一些常用的网页组件,以规范化采用云适配平台开发的移动网站,统一用户体验逐渐形成的。
1、语义化
Amaze UI开发遵循语义化原则,意图通过类名(class)等信息直观传达元素的功能角色,同时关注结构、样式、行为分离,降低各部分的耦合程度,提高开发效率和可维护性。
2、移动优先,跨屏适配
遵循 “移动优先(Mobile First)”、“渐进增强(Progressive enhancement)”的理念,可先从移动设备开始开发网站,逐步在扩展的更大屏幕的设备上,专注于最重要的内容和交互,适应移动互联潮流。轻松创建跨屏适配的网页。
3、模块化,按需定制
AMUI使用LESS编写样式,结构良好,易扩展,易维护;使用Seajs模块化开发、组织 JavaScript,自然、优雅。
4、专注于HTML5
AMUI 基于轻量的Zepto.js开发,有效减少为兼容旧浏览器的臃肿代码;基于 CSS3 的交互效果,平滑、高效。AMUI专注于现代浏览器(支持HTML5),不再为过时的浏览器耗费资源,为更有价值的用户提高更好的体验。
5、本地化支持
相比国外的前端框架,Amaze UI专注解决中文排版优化问题,根据操作系统调整字体,实现最佳中文排版效果;针对国内主流浏览器及App内置浏览器提供更好的兼容性支持,为你节省大量兼容性调试时间。
Amaze UI 的开发历程
云适配创始人陈本峰:这个项目最开始是作为内部使用工具来开发的。我们云适配本身就是一个前端产品,Amaze UI能帮我们降低开发时间和成本,用标准化作业流程,能有更高的产出。
从云适配创立之初,我们就开始积累自己的前端框架,同时也借鉴了Bootstrap等国外框架的优点。在内部使用过程中,大家一致反映不错,我们就希望把这个产品开源,希望分享给更多的人,也希望更多的人来贡献代码,来共建中国前端开源生态环境。在最近几个月,我们投入人力将这个项目整理成一个开源产品。目前有2个软件工程师全职在开发这个产品,还有一个设计,一个PM也在尽力配合。产品发布之后,我们会投入更多全职的工程师来专心打磨这个产品,同时也呼吁更多的前端开发爱好者共同来完善这个框架。
Amaze UI的目标
帮助开发者提高开发效率,提升网页效果,即用最短的时间做出最赞的网页,使更多的前端开发者不再受前端复杂代码困扰。
Jingle移动端框架
官网地址:http://vycool.com/Jingle/
Jingle是一个SPA(Single Page Application)开发框架,用来开发移动端的html5应用,在体验上尽量去靠近native应用,希望有一天html5能够做到与native一样的操作体验。
腾讯移动Web前端框架
官网地址:https://github.com/AlloyTeamDev/Pro
7个优秀的国内外移动端web框架(转)的更多相关文章
- 优秀的vue服务端渲染框架
目前国内优秀的基于vue的ssr框架有minissr,可以在服务端生成html代码,有利于搜索引擎爬取. https://www.wechatmini.com/vue/minissr 使用方法可以参考 ...
- 国内外移动端web适配屏幕方案
基础知识点 设备像素:设备像素又称物理像素(physical pixel),设备能控制显示的最小单位,我们可以把这些像素看作成显示器上一个个的点. iPhone5的物理像素是640X1136. PS: ...
- 国内外移动端web适配屏幕方案总结
基础知识点 设备像素:设备像素又称物理像素(physical pixel),设备能控制显示的最小单位,我们可以把这些像素看作成显示器上一个个的点. iPhone5的物理像素是640X1136. PS: ...
- 移动端Web框架
[参考]移动端 UI设计尺寸(一)篇 [参考]移动端界面设计之尺寸篇 [参考]介绍几个移动web app开发框架 [参考]移动webapp前端ui用哪个框架好 H5 做移动开发也分两种,一种就是正常的 ...
- 跨界 - Omi 发布多端统一框架 Omip 打通小程序与 Web
Omip 今天,Omi 不仅仅可以开发桌面 Web.移动 H5,还可以直接开发小程序!直接开发小程序!直接开发小程序! Github Omi 简介 Omi 框架是微信支付线研发部研发的下一代前端框架, ...
- 移动端webUI框架(HTML5手机框架)
淘宝SUI Mobile框架 官网地址:http://m.sui.taobao.org/ SUI Mobile 是一套基于 Framework7 开发的UI库.它非常轻量.精美,只需要引入我们的CDN ...
- 移动端 Web 开发前端知识整理
文章来源: http://www.restran.net/2015/05/14/mobile-web-front-end-collections/ 最近整理的移动端 Web 开发前端知识,不定期更新. ...
- 移动端web开发的一些知识点
整理一下自己平时移动端web开发中遇到的问题,也参考一下前辈的一些总结 1.最常见的要数1像素边框了 因为Retine屏的分辨率始终是普通屏幕的2倍,1px的边框在dpr=2的retina屏下会显示成 ...
- 移动端web开发技巧
META相关 1. 添加到主屏后的标题(IOS)
随机推荐
- CSS3_天猫商品墙
天猫商品墙 网格状布局: 1. ul li 布局 2. float: left; 使得元素在一行.注意: 父元素解决高度塌陷 3. ul 设置固定宽,使得元素挤下去 4. 给父元素加一个 pa ...
- Qt支持哪些硬件通信协议???
如题,广大使用Qt开发嵌入式的伙伴们知道Qt支持哪些硬件通信协议的开发???目前已知的串口和网络TCP/IP协议开发支持,其他的呢??? 欢迎留言交流!!!
- jenkins-参数化构建(三)插件:Git Parameter
一.下载插件Git Parameter (更加省事) 在配置中branch和tag用的比较多 注意:Credential 可以添加密码,jenkins如果在root用户下载的请改 /etc/sys ...
- 19.3.20 解决pycharm快捷键无法使用问题和熟悉git与码云操作流程
problem:由于Vim插件导致快捷键无法使用: answer:settings→Plugins→搜索到ideaVim→取消选中→apply→重启pycharm: git:创建仓库→生成公钥(ssh ...
- poj1164
#include<iostream> using namespace std; ][]; ][]; int roomnum; int maxroom; int m,n; typedef s ...
- 天梯赛练习题L2-006. 树的遍历
题目链接 已知一棵树的后序遍历顺序和中序遍历顺序,求层次遍历的顺序: 树的四种遍历: 先序遍历:先访问根节点,再访问左子树,最后访问右子树 中序遍历:先访问左子树,再访问根节点,最后访问右子树 后序遍 ...
- C# 图片识别
项目需要识别图片上的信息,网上搜索试了Asprise-OCR.Microsoft Office Document Imaging(Office 2007) 组件实现两种方式,后者可以识别中文等其他语言 ...
- Json对象扩展
1.JSON.stringify(obj/arr) js对象(数组)转换为json对象(数组) 2.JSON.parse(json) json对象(数组)转换为js对象(数组)
- 2018-2019-2 20165236 《网络对抗技术》Exp4 恶意代码分析
2018-2019-2 20165236 <网络对抗技术>Exp4 恶意代码分析 一.1.实践目标 1.1是监控你自己系统的运行状态,看有没有可疑的程序在运行; 1.2是分析一个恶意软件, ...
- Scala集合Map
在scala中Map分为可变长(mutable)和不可变长(immutable) /** * 不可变长map 长度一旦初始化,就不能在进行更改 */ // 通过箭头的方式创建map val map = ...