omi-mp 是什么

Omi 框架是微信支付线研发部和 AlloyTeam 开源的通用 Web 组件化框架，基于 Web Components，用来开发 PC、手机浏览器或者微信、手Q webview 的 Web 页面。自今年5月开源以来，该项目共获得 Star 数 5000+，拥有贡献者29人。经过 Omi 原始开发团队和社区贡献者的共同努力，Omi 的生态发展非常迅速，包括：

其中，Omi 近期发布 omi-mp，旨在打破小程序和 Web 的边界，让“小程序员”能够使用小程序技术栈开发 Web HTML5 的单页应用（SPA）, 也可让已有小程序生成 Web 页面。一次开发，多处运行。比如小程序官方模板生成的 Web 页面：

微信小程序生态
11月7日，马化腾在第五届世界互联网大会上透露了一组数字：目前，已经有150 万开发者加入到了小程序的开发，小程序应用数量超过100万，已覆盖200多个细分行业，日活用户达到2亿。近10个月的时间，小程序的数量几乎翻了一番，开发者数量增长了50万，小程序日活增长了3000万。

据统计，开发小程序用的最多的技术栈是使用小程序提供的语法和工具， 腾讯也在加大小程序基础能力和平台生态的建设。在可以遇见的未来，微信小程序将不仅仅拥抱 Web Components，还会更好的支持NPM、小程序云、可视化编程、分包。小程序的可视化布局体系，能够让开发者拖拖拽拽搭积木一样快速搭建小程序。

微信小程序和 Omi
微信小程序和 Omi 框架都是使用 Web Components（CustomElements 和ShadowDom）渲染组件，以搭积木的方式搭建 Web 页面，小程序在定制的 WebView 中渲染组件，Omi 在 PC、Mobile、TV 等现代浏览器环境渲染组件，Omi 使用 JSX 作为 UI 表达式，小程序使用模板引擎，JSX 是图灵完备，可以表达一切模板引擎。比如举个99乘法表的例子：

编译成 javascript 之后:

小程序支持rpx布局，Omi也增强了CSS, 支持基于750屏幕宽度，支持 rpx 布局。比如定义一个半屏宽度的 div：

小程序和 Omi 有很多共性，自然而然地可以打通二者之间的边界，让小程序在更多的平台上体现其价值，节约公司人力成本，一次开发，多处运行。

这次公开测试的 omi-mp 旨在挖掘小程序的平台潜力和优势，让开发者使用现有的小程序快速生成基于 Web Components 的 HTML5 单页应用，基于 Omi和omi-router 的前端项目，让小程序不仅仅可以运行在微信里，也可以运行在微信内置的浏览器、手Q内置的浏览器、QQ浏览器以及 PC、Mobile、TV 等等的其他浏览器里。你可以同时使用 OMI 开发这工具或者微信开发者工具调试，既然 Omi 使用了 Web Components 和 Shadow-DOM, 所以不需要像 React 一样安装其他元素面板，只需要使用 Chrome 自带的 Elements' sidebar 便可，它和 React开发者工具一样强大。

omi-mp 是一次全新的、突破性的挑战，在使用过程中，对 omi-mp 有任何意见或建议都可以提出 issues，我们会第一时间反馈，你也可以提交 Pull Request，我们会第一时间 review 并合并进去。希望通过开源社区的合力开发能够让 omi-mp 越来越好，让小程序价值越来越大。

小程序开发生成 Web 示例
下面是豆瓣电影小程序 DEMO 和生成的 Web页面的对比：

社区化发展，欢迎加入并贡献社区
目前 Omi 的贡献者遍布国内外各大公司（中国、韩国、美国、土耳其），Omi 共接受了29名贡献者的文档和代码提交，核心贡献者共 11 名。在腾讯内部，Omi 主要是微信支付线研发部和 AlloyTeam 部分成员在维护。欢迎有想法有能力有激情的开发者加入贡献者行列并最终能够进入 Omi Team。

你可以从这几个方面贡献：
1.  翻译文档，目前有中文、英文和韩文，欢迎其他语言版本的翻译加入
2.  提交补丁代码优化 Omi
3.  积极参与 Issue 的讨论，如答疑解惑、提供想法或报告无法解决的错误
4.  贡献案例，可以是管理后台、PC 网站、移动端 H5等等
5.  完善文档，可以反复修正文档，让其更易懂，上手更快
6.  扩展 Omi 生态，编写 omi 自定义组件
7.  分享与 Omi 的故事，优秀的会挂在 Omi 首页 readme 里
8.  写 Omi 相关的 blog，优秀的会挂在 Omi 首页 readme 里
我们非常欢迎开发者们为腾讯开源贡献一份力量，相应也将给予贡献者激励以表认可与感谢。参见腾讯贡献者激励计划

Omi 交流群
欢迎加入Omi交流群，群聊号码：256426170，也可扫码加入:

Omi Conf
最后有一个好消息要告诉大家！Omi Conf 前端开发者大会预计年底会在深圳举行，目前我们收集广大用户和贡献者的意见，具体这里可以留言反馈参会意见建议：
https://github.com/Tencent/om...

破界！Omi生态omi-mp发布，用小程序开发生成Web的更多相关文章

  1. 微信小程序详细图文教程-10分钟完成微信小程序开发部署发布

    很多朋友都认为微信小程序申请.部署.发布很难,需要很长时间. 实际上,微信和腾讯云同是腾讯产品,已经提供了10分钟(根据准备资源情况,已完成小程序申请认证)完成小程序开发.部署.发布的方式.当然,实现 ...

  2. 发布微信小程序体验版

    小程序这么火,一直没有做过.因为公司有个业务需要做小程序就顺带学习了一把. 1)本次是采用<微信开发者工具 Stable v1.02.1904090>进行的开发: 2)前端使用的是微信官方 ...

  3. 微信小程序开发实战视频教程发布

    昨日(9月23),腾讯终于发布了没有APPid,无需申请也可以进行微信小程序开发的视频教程了,我在在第一时间尝试并发布了这7个小视频教程,入门足够了.... 各位免费拿去,慢慢享用: 链接: http ...

  4. QQ小程序开发与发布小教程

    QQ小程序QQApp,和微信小程序类似,可以直接在手机QQ中直接打开,应用内应用,省去了安装手机APP,非常方便.官方的介绍:QQ小程序为QQ体系下的应用开放平台,可为不同类型的产品提供框架,并在QQ ...

  5. 【Gamma】“北航社团帮”发布说明——小程序v3.0

    目录 Gamma版本新功能 小程序v3.0新功能 新功能列表 新功能展示 这一版修复的缺陷 Gamma版本的已知问题和限制 小程序端 网页端 运行.安装与发布 运行环境的要求 安装与发布 小程序 网页 ...

  6. 微信小程序开发 -- 01

    微信小程序开发基础 -- 开发前的准备 缘由 1月9日张小龙微信小程序正式上线,因为微信,所以小程序从诞生开始就头戴巨大的光环,很多的团队,公司以及开发的个体都眼巴巴的盯着这个小程序.而那个时候我却在 ...

  7. mpvue体验微信小程序开发

    微信小程序 https://developers.weixin.qq.com/miniprogram/introduction/index.html?t=18082114 微信小程序是一种全新的连接用 ...

  8. 零基础入门微信小程序开发

    注:本文来源于:<零基础入门微信小程序开发> 课程介绍 本达人课是一个系列入门教程,目标是从 0 开始带领读者上手实战,课程以微信小程序的核心概念作为主线,介绍配置文件.页面样式文件.Ja ...

  9. 记一次基于 mpvue 的小程序开发及上线实战

    小程序名称:一起打车吧 项目地址: 客户端:https://github.com/jrainlau/taxi-together-client 服务端:https://github.com/jrainl ...

随机推荐

  1. js 把x,y轴两个数组变成[[x,y],[x,y]]的二维数组

    例如有X轴数组xarr=[2006,2007,2008],Y轴数组yarr=[12,15,18],代码如下: //调用 mergexy([2006,2007,2008],[12,15,18]); // ...

  2. JQuery常见方法

    <!DOCTYPE htmi> <html> <head> <meta charset="UTF-8"> <title> ...

  3. 【计算机网络】TCP的三次握手与四次挥手

    今天讲一下TCP的三次握手与四次挥手 1.首先说TCP 协议的特点:TCP是在不可靠的IP层之上实现的可靠的数据传输协议,它主要解决传输的可靠.有序.无丢失和不重复问题.TCP 是TCP/IP 体系中 ...

  4. 实战：Spring AOP实现多数据源动态切换

    需求背景 去年底,公司项目有一个需求中有个接口需要用到平台.算法.大数据等三个不同数据库的数据进行计算.组装以及最后的展示,当时这个需求是另一个老同事在做,我只是负责自己的部分. 直到今年回来了,这个 ...

  5. Navicat v15 破解

    特别注意: 1.断网,否则在安装过程中会失败 2.关闭防火墙及杀毒软件 3.选择对应版本:mysql版就选择mysql 4.如果出现 就卸载,删除注册表,重新安装,出现rsa public key n ...

  6. 远程控制Windows2003下安装Pcanywhere导致Awgina.dll出错的解决办法

    远程控制的时候出现的问题引用 症状启动计算机时,"欢迎使用 Windows"登录屏幕不出现.您还可能会看到与下面的某条信息类似的错误信息: ? 一个最近安装的程序使欢迎屏幕和快速用 ...

  7. 如何解决代码中if/else 过多的问题

    前言 if...else 是所有高级编程语言都有的必备功能.但现实中的代码往往存在着过多的 if...else.虽然 if...else 是必须的,但滥用 if...else 会对代码的可读性.可维护 ...

  8. Buffer 和 cache

    要问Cache和Buffer的区别,首先要问另一个问题:为何会存在Cache和Buffer? 无论缓存还是缓冲,其实本质上解决的都是读写速度不匹配的问题,从这个角度,他们非常相似. 知乎上关于Cach ...

  9. 写fstable

    mountpoint 就是挂载点./. /usr. swap 都是系统安装时分区的默认挂载点. 如果你要挂载一个新设备,你就要好好想想了,因为这个新设备将作为文件系统永久的一部分,需要根据FSSTND ...

  10. 通过PROFINET网络实现SINAMICS 120的PN IO OPC通讯，起动及调速控制 | OPC通讯

    1 概述 TCP/IP 通讯的传输时间可能太长,并且该时间具有不确定性,无法满足生产自动化领域的要求.因此,在进行时间要求苛刻的IO 有效载荷数据通讯时,PROFINET IO 不使用TCP/IP,而 ...