SEO 站群从前端开发的视角,为大家分析下 WordPress 微信小程序和 HTML5 与之间的主要区别

  条是执行环境的不同

  传统的 HTML5 的执行环境是浏览器,包括 webview,而 WordPress 微信小程序的执行环境并非完整的浏览器,大家注意,SEO 站群这里写的是 “非完整的浏览器”,有以下几个原因

  小程序的开发过程中会用到 HTML5 相关的技术 (并非全部)

  小程序后的发布上线需要 WordPress 微信稽核,WordPress 微信在不更新自身软件的情况下可以将小程序更新到自身软件内,这就联想到了 ReactNative 框架,并且已经有开发者在 WordPress 微信小程序的开发工具原始码中发现使用了 React 和 NodeWebkit 库

  官方文件中着重强调了指令码内是无法使用浏览器中常用的 window 物件和 document 物件(基于这一点,像 zepto/jquery 这种操作 dom 的库就被完全抛弃了)

  所以 SEO 站群认为,小程序的执行环境很有可能是 WordPress 微信开发团队基于浏览器核心完全重构的一个内建解析器,针对小程序专门做了优化,配合自己定义的开发语言标准,提升了小程序的效能。

  不过由于 WordPress 微信给开发者提供了开发工具,而开发工具中也内建了程序设计、除错、开发环境、发布于一身,我们也不用再探讨它的终执行环境了,只要按照官方文件进行开发就可以了。并且从 WordPress 微信团队给开发者提供开发工具这一举动,让人联想到了苹果给开发者提供的 X-CODE 开发工具,可以想象 WordPress 微信的 “野心” 可见一斑。

  第二条是开发成本的不同

  这里 SEO 站群提出了一个问题,当我们面对一个 HTML5 web 开发需求时,我们需要考虑什么呢?抛去开发工具(vscode 、 sublimtext 、 Atom 等)不谈,大到前端框架(Angular 、 react 、 vue 、 backbone 等)、模组管理工具(Webpack 、 Browserify 等)、任务管理工具(Grunt 、 Gulp 等),小到 UI 库选择、介面呼叫工具(ajax 、 FetchApi 等)、浏览器相容性等都要我们一一考略,再不济用 jqery 外挂写 H5,也要在开发过程中去寻找合适的 jquery 外挂来配合专案。尽管这些工具可定制化非常高,并且提高了开发者的开发效率,但我们相信专案开发的配置工作已经消耗了不少精力,尽管大部分开发者都有自己的配置模板,但长久以来对于专案中使用的各种外部库的版本迭代、版本升级所产生的成本应该也不低。

  而当我们面对一个 WordPress 微信小程序的开发需求时,需要考虑什么呢?WordPress 微信团队提供了开发者工具,并且规范了开发标准,前端常见的 HTML 、 CSS 变成了 WordPress 微信自定义的 WXML 、 WXSS,WXML 中尽管全部是自定义标签,但官方文件中都有明确的使用介绍,相信上手应该是非常容易的;WXSS 、 JSON 和 JS 档案中的写法稍有限制,但整体相差不多。在统一了这些标准之后,作为一个开发者,您会发现,自己只要专注写程序就可以了:

  当需要呼叫后端介面时,呼叫发起请求 API
  当需要上传下载时,呼叫上传下载 API
  当需要资料快取时,呼叫本地储存 API
  引入地图、使用罗盘、呼叫支付、呼叫扫码等等功能都可以直接使用
  UI 库方面,框架自然带有自家 weui 库加成

  并且在使用这些 API 时,您不用再去顾虑浏览器相容性,不用担心生产环境中出现不可预料的奇妙 BUG,可见 WordPress 微信小程序的开发成本确实相比以往的 web 开发低很多。

  第三条是获取系统级许可权的不同

  WordPress 微信小程序相对于 HTML5web 应用能获得更多的系统许可权,比如网络通讯状态、资料快取能力等,这些系统级许可权都可以和 WordPress 微信小程序无缝衔接,也就是官方宣称的拥有 Native WordPress APP 的流畅效能,而这一点恰巧是 HTML5 web 应用经常被诟病的地方,这也是 HTML5 的大多应用场景被定位在业务逻辑简单、功能单一的原因。

  第四条便是应用在生产环境的执行流畅度

  这条无论对于多用户还是开发者来说,都是直观的感受。长久以来,当 HTML5 应用面对复杂的业务逻辑或者丰富的页面互动时,它的体验总是不尽人意,需要不断的对专案优化来提升多用户体验。但是由于 WordPress 微信小程序执行环境独立,尽管同样用 html+css+js 去开发,但配合 WordPress 微信的解析器终渲染出来的是原生组件的效果,自然体验上将会更进一步。