时隔两年,再次上手小程序开发

小程序开发框架经过两年左右的迭代,发展的越来越成熟和完善了,无论框架层面还是开发工具层面,体验都上升了一个层次,借《宝贝成长助理》这个项目的契机,总结一下在2019年这个时间点,小程序开发的现状。

项目背景

做宝爸快一年了,自然会花一些精力调整知识结构,关注婴幼儿成长方面的知识,现在的宝宝在营养方面普遍处于过剩状态,身边越来越常见到那种明显“富态”的宝宝,对于孩子何谓胖何谓瘦众说纷纭,为了有一个权威可靠的标准去衡量孩子的生长健康状况,我查了世界卫生组织提供的婴幼儿成长标准,标准以天为单位,提供5岁以内婴幼儿的身高、体重、BMI(衡量胖瘦)等指标的分布占比信息,也就是说任意天数的宝宝都能查到当下最符合健康成长规律的身高、体重、BMI数值,也可以查到宝宝当前的成长数据处于整体样本库中的什么位置,以此衡量宝宝的成长状态,辅助纠正宝宝的喂养问题。

经过一个周的开发,目前初代版本已上线,欢迎扫码体验。

成长助理

整体感受

两年前小程序刚推出的时候也是我第一次接触小程序开发,当时漫无目的的做了一个DEMO项目,并写了一篇《小程序上手指南》,内容非常粗浅,本以为时隔两年重读小程序开发文档,会有很多“硬货”,然后并没有。相比两年前小程序框架最大的改动就是引入了组件和插件两个概念,极大提升了小程序的开发体验,但其实在熟悉现代前端框架的开发者眼里,这些都是早已经过时间检验的最佳实践,没有是小程序的缺陷,有了才是顺理成章,所以这方面不能算惊喜。

另外,小程序插件库的入口藏得有点深,竟然不在文档的一级导航上,也没有整合到开发工具中,有点奇怪。

真正令我印象深刻的点有五个。

  1. 开发工具的真机预览和调试功能特别好用,可以说完全符合预期,因为我之前没有关注这个功能的迭代过程,所以对我来说冲击很大,有种从0到100一步到位的惊艳感。
  2. 文档新增的《小程序开发指南》非常值得一读,能帮助加深对小程序整体技术架构的理解,减少一些跳坑几率。
  3. 还不错的动画API。动画API其实是操作CSS动画的语法糖,目的是让CSS动画变得可编程,是很好的功能,使用体验一般吧,不好也不坏。
  4. 符合开发者利益,符合用户利益。小程序框架的一些改动非常有心,比如新增的几个开放能力组件,开发者可以在用户不授权不登陆的情况下展示用户基本信息,很多本不需要用户系统,仅仅想展示一下用户头像的业务,终于有了正确的实现方式;而对用户来说,基本信息并没有被开发者获取到,减少了无意义的授权,双赢。
  5. 无后端开发的典范——小程序云开发。小程序对开发者的定义从来不只是程序员群体,而是包括产品经理、设计师、甚至中学生在内的所有需要开发小程序的人,所以小程序开发框架越迭代越简单,而有了云开发之后,可以说真正做到了任何人都可以通过简单学习去开发一个功能完善的小程序。这一点下面单独展开说。

小程序云开发

小程序云开发是微信官方推出的无后端开发服务。无后端开发模式不是新鲜事物,甚至经过三五年的发展这个词已经有些过气了,并不为人所知,但无后端的思想和一些典型经验在小程序云开发中体现的淋漓尽致,细节处又与业务结合的恰到好处,相比我之前了解的其他无后端服务,小程序云开发给我的感受就好像:一个从没摸过钢琴的人,一上手竟弹出肖邦的水平。

无后端其实可以简单粗暴的归纳为数据库、存储空间、算力(云函数)以及其他们的运营托管服务的打包租赁,单纯拿出来说是特别简单的一个东西,而这几样东西被小程序开发工具有机的整合起来,却呈现出一种新的生命力。

云开发提供的是非关系型数据库,但文档里从头到尾你看不到非关系型这几个字,只有寥寥几个简单的示例,一下就能明白这个东西该怎么用,剩下的很多文档甚至都不用看了,等到用的时候再来查就行,简单业务在小程序端就能实现数据库的增删改查;存储空间不说了,本来就简单,整合到云开发的API里之后也是一如既往的简明易懂;云函数是近一两年出的新东西,BAT三家云服务都在做,很长一段时间我不理解云函数和我50块/年的阿里云虚拟机比有什么优势,但就这样一个东西被小程序整合了用户鉴权之后,简直成了神器,复制黏贴文档上的示例代码,简单几步就能实现用户登录;结合数据库和存储服务,只要不是太复杂的业务都能靠云函数搞定。云函数用的还是Nodejs语言,实在想不出小程序开发哪里还能用得到后端,所以我说,小程序的云开发是无后端开发的典范,是对无后端技术整合的最佳实践。

这也暗合张小龙在最近一次年度演讲中提到的他对技术的看法,大意是技术的价值不在于技术本身,而在于正确的应用场景。实际上微信7.0的视频动态功能里,视频配乐就应用了AI技术去匹配背景音乐,如果你还没用过这个功能,建议你马上体验一下。我个人的感受是做的特别好,甚至比很多将AI作噱头的营销PPT吹的都要好。推送的前几首音乐往往是AI匹配的,因为我经常拍的就是我儿子,我发现推送的音乐首先可以做到在情感类型上与视频内容匹配,是可爱的还是动感的还是搞笑的,都判断的很准确,这一点非常重要,可以强化视频的情感表达,让本来没有那么好玩的一个视频变得妙趣横生;然后音乐的节奏也能做到跟人物动作匹配,甚至有时候节奏还能对上人物的口型,最终的效果就是,经常让我觉得背景音乐成了视频动态的点睛之笔,这种感受恐怕只有亲身体验过人才会知道有多棒。将AI技术应用的这么好,微信团队却从没有公开提过,甚至没看过张小龙那次演讲的人,可能一辈子都不会知道微信里的这个小功能,其实运用了当下最尖端的AI技术,并且炉火纯青。

一些遗憾

夸了这么多但总归还是有一些遗憾,主要有四点。

  1. canvas应用受限。我这次做的项目里涉及到数据呈现,本来希望能用canvas绘制,但canvas是原生组件,脱离webview独立渲染,导致跟swiper组件结合使用时出现异常,表现为页签滑动但是页签里的canvas不动。最后的解决方法是先用canvas绘制出来,然后截屏保存再处理成背景图片,没办法,谁让我的PS水平画不出来我想要的效果呢。
  2. 官方社区还是不理想。貌似活跃了可以忽略不计的那么一点点吧,但总体来说问答数量的积累还是不够,经常有问题搜不出来,而开发中的问题如果你等着官方给你回复,估计等半天等来的答案会让你更上火,还不如百度一下来的效率。社区的搜索功能还有一个明显的槽点,搜索输入框后面的放大镜是不能点击的,只能通过回车键进入搜索结果,很难想象这个社区是微信团队做出来的。
  3. 开发文档仍然有一些地方不够细致,比如canvas的一些接口和文件操作的一些接口,怎么说呢,会让你有一种不懂的时候怎么看都不懂,懂了之后再看“奥原来是这个意思啊”的感觉。
  4. 开发工具表现的不太稳定,开发过程中发现canvas绘制和文件操作方面有时候跟真机表现不一致,然后不知道什么时候再看就莫名其妙的正常了,很奇妙;然后就是老生常谈的问题,编辑器不好用,而且有低级错误,在小屏笔记本上选中一段代码点鼠标右键,代码的选中状态会消失而且代码会网上滚动一行左右。

关于跨平台开发框架

我关注到最近圈子里出现了一种跨平台开发框架,可以一统包括小程序在内的各种前端开发平台,妥妥的前端版“一次开发,处处运行”。优点显而易见,如果需求上同时需要一个小程序和一个H5,业务完全一样,那么代码就可以100%复用,完美。

但我对这种技术架构不感冒,我倾向于用最直接的方式去开发目标平台,首先小程序自身框架做到目前的程度,是可用的,吐槽开发体验我觉得就是鸡蛋里挑骨头了。即便考虑到代码复用,我也不认为一套代码同时跑在小程序和H5上是一种好的技术架构,因为我的经验是,每个平台都有自己的业务特点,会催生出不同的业务需求,随着时间的推移,他们终究会成为不同的东西,到那个时候想要摆脱这套框架,带来的成本恐怕就是重构级的。

而且这种包装本身就会带来很多问题,需要跟进平台更新,需要持续抹平平台差异,你代码复用省下的时间要能覆盖掉这些维护成本才行,可能是我没遇到合适的场景吧,我只能想到做外包的时候用一下比较省事,反正后续不需要自己维护,其他情况真的想不到了。

最后

受限于这次的小程序项目比较简单,这次的体验还不够全面和深入,暂且总结以上几点,总体来说小程序已经做的特别好了,开发体验不错,其他细节以后有机会再深入体验吧。

前端路上原创技术文章,转载请注明出处:https://refined-x.com/2019/02/25/时隔两年,再次上手小程序开发/

看风景-公众号

不甘平庸的你,快来跟我一起充电吧,关注看风景,获取更多精彩内容。