微信小程序应用号开发体验

 更新时间:2016年09月23日 14:25:34   作者:段隆贤  
这篇文章主要介绍了微信小程序(应用号)开发体验的相关资料,需要的朋友可以参考下

昨天微信小程序(应用号)内测的消息把整个技术社区炸开了锅,我也忍不住跟了几波,可惜没有内测资格,听闻破解版出来了,今天早上就着原来的项目资源试开发了一下,总结一下体验.

总体体验

  1. 开发效率高,6:40左右破解完IDE,7:20左右点做完了首页和导航栏的布局,微信把觉见的布局都做了封装,比传统的前端开发效率高。
  2. 前端可以快速上手:熟练的前端可以很快上手,可能只要一小时读文档的时间加一个官方的例子。
  3. 开发工具难用,很多目录的操作和IDE常见的格式化代码,html配对等功能暂不支持。
  4. 开发限制了很多前端常见的Dom,window操作,开发的灵活度和难度降低。
  5. 我没有内测资格,小程序还不能上传体验,只能下载代码本地体验。

本文代码放在github

上截图

相关资源

破解的IDE

开发资源集合

IDE技术栈:NodeWebkit + React

进入的安装目录:微信web开发者工具\package.nw\app
这个*.nw就能十有八九猜出是NodeWebkit封装的Web应用,
详看依赖node_modules证实了猜想。
在package.json "main": "app/html/index.html"定义了入口。

所有的组件本质是React组件

在入口中可以看到直接引用了React 和React DOM

"use strict";
function init() {
  tools.Chrome = chrome;
  var n = require("../dist/lib/react.js"),
    e = require("../dist/lib/react-dom.js"),
    i = require("../dist/common/loadInit/init.js"),
    o = require("../dist/components/ContainController.js"),
    t = require("../dist/common/proxy/startProxy.js"),
    r = require("../dist/actions/windowActions.js"),
    s = require("../dist/actions/webviewActions.js"),
    d = require("../dist/stroes/webviewStores.js"),
    u = require("../dist/common/log/log.js"), c = require("../dist/common/shortCut/shortCut.js"), l = global.appConfig.isDev;
    //...
}

看一下组件Dropdown的定义,这不就是我们熟悉的React在ES5中创建组件的方法吗?

"use strict";
var React = require("../../lib/react.js"), Dropdown = React.createClass({
  displayName: "Dropdown", render: function () {
    return React.createElement("div", {className: "dropdown"}, React.createElement("div", {className: "dropdown-item"}, React.createElement("img", {
      src: "https://mmrb.github.io/avatar/jf.jpg",
      alt: "",
      className: "dropdown-item-icon"
    }), React.createElement("div", {className: "dropdown-item-info"}, React.createElement("p", null, "公众号名称啦")), React.createElement("div", {className: "dropdown-item-extra"}, React.createElement("img", {
      src: "https://mmrb.github.io/avatar/jf.jpg",
      alt: "",
      className: "dropdown-item-extra-icon"
    }))), React.createElement("div", {className: "dropdown-item dropdown-item-active"}, React.createElement("img", {
      src: "https://mmrb.github.io/avatar/jf.jpg",
      alt: "",
      className: "dropdown-item-icon"
    }), React.createElement("div", {className: "dropdown-item-info"}, React.createElement("p", null, "公众号名称啦公众号名称啦公众号名称啦"))), React.createElement("div", {className: "dropdown-item"}, React.createElement("img", {
      src: "https://mmrb.github.io/avatar/jf.jpg",
      alt: "",
      className: "dropdown-item-icon"
    }), React.createElement("div", {className: "dropdown-item-info"}, React.createElement("p", null, "公众号名称啦"))), React.createElement("div", {className: "dropdown-item"}, React.createElement("img", {
      src: "https://mmrb.github.io/avatar/jf.jpg",
      alt: "",
      className: "dropdown-item-icon"
    }), React.createElement("div", {className: "dropdown-item-info"}, React.createElement("p", null, "公众号名称啦"))))
  }
});
module.exports = Dropdown;

微信限制了小程序的包大小

同时微信限制了小程序包的大小,为755kb,对缓存和本地文件应该也有控制,这相对原生应用动不动几十兆上百兆的大小来说,绝对是一个亮点,给网上很多人说装微信小程序同样会占用手机存储的人一个响亮的耳光。

 

总结

总的来说,对前端来说绝对是一个好消息,短期内前端待遇可能上涨,但小程序开发门槛较低(比前端的低),有一部开发人员是面向工资编程,随着开发人员的流动,长期还是会和其它相关的的技术岗持平。所以,少年,不要激动,还要是把基础知识打扎实。

 以上就是对微信小程序的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!

相关文章

  • cnpm不是内部命令的解决方案:配置环境变量【推荐】

    cnpm不是内部命令的解决方案:配置环境变量【推荐】

    这篇文章主要介绍了cnpm不是内部命令的解决方案:配置环境变量的相关知识,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-07-07
  • 关于Xmind免费激活方法(推荐)

    关于Xmind免费激活方法(推荐)

    这篇文章主要介绍了关于Xmind免费激活方法,下载好之后需要打开安装路径然后激活,本文通过图文并茂的形式给大家介绍的非常详细,需要的朋友可以参考下
    2021-10-10
  • asp php 清空access mysql mssql数据库的代码

    asp php 清空access mysql mssql数据库的代码

    php清空mysql asp情况access或mssql
    2008-12-12
  • vs2019+cmake实现Linux远程开发的方法步骤

    vs2019+cmake实现Linux远程开发的方法步骤

    这篇文章主要介绍了vs2019+cmake实现Linux远程开发的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-04-04
  • UltraEdit编辑器免费激活方法

    UltraEdit编辑器免费激活方法

    UltraEdit 是一套功能强大的文本编辑器,可以编辑文本、十六进制、ASCII 码,完全可以取代记事本,下面小编把这款UltraEdit编辑器免费激活方法分享给大家,需要的朋友参考下
    2021-08-08
  • vscode添加GIT和SVN的方法示例

    vscode添加GIT和SVN的方法示例

    这篇文章主要介绍了vscode添加GIT和SVN的方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-04-04
  • Deepseek部署到本地Windows的详细过程

    Deepseek部署到本地Windows的详细过程

    如何在Windows10系统上部署DeepSeekAI人工智能,步骤包括安装Ollama底层软件和选择合适的模型进行部署,感兴趣的朋友跟随小编一起看看吧
    2025-02-02
  • Protobuf在Cmake中的正确使用方法详解

    Protobuf在Cmake中的正确使用方法详解

    这篇文章主要介绍了Protobuf在Cmake中的正确使用方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-03-03
  • 如果你有这33种症状了请离开电脑去走走吧!

    如果你有这33种症状了请离开电脑去走走吧!

    这篇文章主要介绍了如果你有这33种症状了请离开电脑去走走吧!本文是关注程序员、上班族身心健康的文章,需要的朋友可以参考下
    2014-09-09
  • 卷积神经网络Inception V3网络结构图

    卷积神经网络Inception V3网络结构图

    这篇文章主要为大家介绍了卷积神经网络的网络结构图Inception V3的结构图层详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-05-05

最新评论