《科技爱好者周刊》小程序上线啦 😄,内容同步自科技爱好者周刊(阮一峰)github仓库

H5与小程序技术方案比较

记录下H5与小程序技术方案的主要差异

小程序H5

关于浏览器环境JS单线程及小程序双线程架构的一点思考

想通了一件事情

js小程序

小程序发展阶段

蓄势需两年

  • 大量中小企业都已经开始使用小程序,达到30%的水平,预计还需要两年或者更久

生态雏形初步形成

  • 四大基础能力
    • 流量分发
      • 生态中必须具有海量的用户,并且能够帮助企业找到最精准的用户
    • 线下连接
      • 核心在线下,场景来自线下
    • 交易闭环
      • 支付交易闭环
    • 开发者生态
      • 公平公正环境
      • 互利共赢机制
      • 共生的决心
小程序生态雏形

mpvue框架下使用小程序云开发获取用户openid

记录下mpvue框架下进行云开发需要的配置

小程序mpvue云开发

日访问百万级微信小程序优化技巧总结

借负责的小程序流量暴增事件总结下优化技巧

小程序性能优化

mpvue下小程序检测版本更新

记下检测版本更新的代码

小程序mpvue

mpvue编辑页返回前页面时编辑页输入的数据不自动清空的bug

记录下mpvue框架下做数据编辑页时出现的bug处理方法

小程序mpvue

解决iview weapp的i-input组件在微信开发者工具中不能输入值的问题

记录下i-input组件在模拟器中不能输入值问题的原因及解决办法

小程序mpvue

mpvue下小程序云开发实现余额提现订阅消息提醒

在小程序模板消息下线的日子记一下订阅消息的使用

小程序mpvue订阅消息云开发

mpvue适配iphone x

最近在学习mpvue,记一下苹果X安全区域的适配问题

小程序mpvue

浅谈腾讯云·云开发与小程序·云开发的区别

看到不少同学对此有疑问,所以专门总结了一下两种云开发的区别

云开发小程序

基于小程序云开发能力和vant业务组件实现省市区选择

记一下vant的云开发示例实现

小程序mpvue云开发

小程序、公众号文章、H5跳转路径简述

几种小程序、公众号文章、H5的跳转路径笔记

小程序公众号H5

微信服务端消息推送小结

记录一下微信服务端消息推送相关内容

小程序微信公众号消息推送

小程序wxml使用外部函数

1.新建wxs文件,例如array_fun.wxs:

  • 这里为判断元素在数组中是否存在,存在返回true否则为false

var arr_fun = {
    array_index: function (search, array) {
        for (var i = 0; i < array.length; i++) {
            if (array[i] == search) {
                return true;
            }
        }
        return false;
    }
}

module.exports = {
    array_index: arr_fun.array_index
}
小程序wxml外部函数

小程序tabBar图标显示过大处理

最近在做锡慧在线小程序时遇到底部tabBar图标显示过大的问题,记录一下

小程序tabBar图标

10分钟带你反编译网易严选电商微信小程序

以网易严选为例视频讲解小程序反编译操作流程

小程序反编译

小程序获取当前页面路由

获取当前页面栈的实例取最后一个元素

小程序页面路由

小程序IntersectionObserver用法

锡慧在线小程序课程详情页时需要在页面向下滚动的时候显示吸顶锚点菜单,记一下IntersectionObserver的用法

小程序IntersectionObserver

小程序scroll-view滚动时高亮对应区域的吸顶tab项

记一下scroll-view的使用

小程序scroll-viewtab高亮

小程序云函数实现发送模板消息

记一下云函数实现模板消息发送

小程序云开发云函数模板消息

小程序formid埋点

只有form提交的时候才会有formId,这样用户的formId可能数量比较少,不能实现发送很多微信模板消息。所以要用伪装表单的方式来实现获取formId。

小程序formid埋点

小程序微信支付errcode:40163问题

小程序code重复使用

小程序云函数实现客服消息回复

记一下云函数实现客服消息回复

小程序云开发云函数客服消息

微信小程序运行机制

运行环境差异

  • iOS:JavaScriptCore->WKWebView渲染
  • Android:X5 JSCore来解析(X5基于Mobile Chrome 53/57 内核)
  • DevTool:nwjs->Chrome Webview渲染
小程序运行机制

小程序发展时间轴

分享一张图

小程序时间轴

微信小程序WXS特征及适用场景

记一下小程序的wxs相关

小程序

小程序button按钮误触发问题

记一个奇葩问题

小程序

小程序刘海屏适配及兼容全面屏底部横条(indicator)

小程序适配iPhone刘海屏及indicator的方法

小程序刘海屏

反编译微信小程序错误解决

$gwx is not defined和__vd_version_info__ is not defined错误解决

小程序

小程序UI库推荐

推荐几款小程序端常用的UI库

小程序UI库

小程序使用view标签而不使用div的底层原因

记一下为什么小程序非要使用自己封装的标签

小程序

小程序image标签mode属性

微信小程序image标签的mode属性介绍

小程序imagemode属性

小程序优化建议

setData

  • 频繁setData(毫秒级)后果
    • Android 下用户在滑动时会感觉到卡顿,操作反馈延迟严重,因为 JS 线程一直在编译执行渲染,未能及时将用户操作事件传递到逻辑层,逻辑层亦无法及时将操作处理结果及时传递到视图层
    • 渲染有出现延时,由于 WebView 的 JS 线程一直处于忙碌状态,逻辑层到页面层的通信耗时上升,视图层收到的数据消息时距离发出时间已经过去了几百毫秒,渲染的结果并不实时
  • 每次 setData 都传递大量新数据
    • 数据传输实际是一次 evaluateJavascript 脚本过程,当数据量过大时会增加脚本的编译执行时间,占用 WebView JS 线程
  • 后台态页面进行 setData
    • 当页面进入后台态(用户不可见),不应该继续去进行setData,后台态页面的渲染用户是无法感受的,另外后台态页面去setData也会抢占前台页面的执行
  • 建议
    • 不要频繁调用setData, 尽量合并到一次setData调用
    • 传输数据量跟通信性能有关,尽量少于64k,避免一些不需要在页面展示的复杂数据结构或者长字符串
    • 与界面无关的数据最好不要设置在data中
    • 去掉不必要的事件绑定,减少通信的数据量以及次数
    • 不要在节点data前缀放置过大数据(需要传输target的currentTarget和dataset)
小程序优化

小程序wx:if与hidden比较

wx:if

有更高的切换消耗

  • 条件值切换,有一个局部渲染的过程,因为它会确保条件块在切换时销毁或重新渲染
  • 惰性的,在隐藏的时候不渲染,如果在初始渲染条件为 false,则在条件第一次变成真的时候才开始局部渲染

适用场景:运行时条件不大可能改变

小程序wx:ifhidden

小程序页面调试模式下正常但线上打不开的部分决解办法

1.确认开发者工具是否开启不验证合法域名,先关闭不校验合法域名
⬇️

2.查看工具的报错域名信息
⬇️

3.小程序后台的服务器域名填写处添加工具里报错的域名

小程序调试模式解决办法线上打不开

小程序启动过程

1.小程序初始化

微信会初始化小程序环境,比如逻辑层的js引擎,视图层的WebView,并且注入公共基础库

⬇️

2.下载小程序代码包
进行业务小程序代码包的下载

小程序启动过程

小程序开发注意事项

本文从开发、工具使用、服务器、测试等方面比较全面地整理了小程序开发注意事项

小程序开发总结

小程序下拉刷新真机上不回缩问题解决

加上代码wx.stopPullDownRefresh(); //停止下拉刷新


/**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    this.getCourseList();
    this.getErrBookList();
    this.getYouLike();
    this.getCoach();
    this.getBrowsedCourseList();
    this.getBrowsedVideo();
    wx.stopPullDownRefresh();
  },
小程序下拉刷新不回缩

小程序更新机制

未启动时更新
开发者在管理后台发布新版本的小程序之后,如果某个用户本地有小程序的历史版本,此时打开的可能还是旧版本。微信客户端会有若干个时机去检查本地缓存的小程序有没有更新版本,如果有则会静默更新到新版本。总的来说,开发者在后台发布新版本之后,无法立刻影响到所有现网用户,但最差情况下,也在发布之后 24 小时之内下发新版本信息到用户。用户下次打开时会先更新最新版本再打开

启动时更新
小程序每次冷启动时,都会检查是否有更新版本,如果发现有新版本,将会异步下载新版本的代码包,并同时用客户端本地的包进行启动,即新版本的小程序需要等下一次冷启动才会应用上。

小程序更新机制

小程序就是浏览器?

之前公司技术总监说小程序就是个浏览器,有其它同事也有说过小程序类似浏览器这种观点。通过这篇文章来探讨一下这种说法。

小程序浏览器

小程序云开发优势

介绍下云开发优势

小程序云开发

小程序云函数生成小程序码

云函数生成小程序码的Demo

小程序云开发云函数

小程序云函数访问第三方服务器错误解决

记录下云函数访问第三方服务器报错的解决办法

小程序云函数

小程序学习路线

总结一下小程序的学习路径、入门方法

小程序

mpvue框架下小程序分享朋友圈功能实现

记一下小程序分享朋友圈功能的实现

小程序分享朋友圈mpvue

小程序反编译windows辅助脚本

小程序反编译工具在windows系统下的调用脚本

小程序反编译

基于electron-vue开发的微信小程序反编译客户端

开源一个小程序反编译客户端

小程序反编译客户端electron-vue

以中银E路通小程序为例10分钟带你学会微信小程序的反编译

以一个简单的例子介绍下小程序反编译操作流程

小程序反编译
好文推荐

扫描下方二维码阅读文章

浏览器、微信扫码
微信小程序
微信扫码关注
领取学习礼包
技术交流群
每天进步一点点~