FinClip凡泰极客小程序体验尝鲜

语言: CN / TW / HK

highlight: a11y-dark theme: smartblue


本文正在参与#稀土掘金×凡泰极客小程序体验有奖征文活动#,走进FinClip,轻松实现小程序产品梦。

看到这个活动还是有些激动的,虽然目前在做服务端开发,但是想当年,在2016年底微信小程序开放内测的时候,就做了小程序开发的尝试,算是国内最早开发小程序的那波人了。

当时有句slogan是这样的:🔽

7a8ae75fbc74bbb7d3ecf5880601ea65.jpeg

思考🤔

有哪些同学和我一样,看到FinClip就想到了uniapp,心想这俩有啥区别?FinClip做了什么uniapp没做的事情吗?

咱们先来瞧一瞧两者的官网:

uniapp

FinClip

(毕竟我也是研究过uniapp的人,要首先搞清楚FinClip比uniapp的优势在哪里,这样才有动力继续研究FinClip)

在经过一番调研之后发现两者的区别是这样的:

  1. uni-app 主要用于解决跨端应用开发问题,通过使用 Vue.js 开发所有前端应用的框架,保证开发者编写一套代码,就可以发布到多个 App 与小程序平台中。
  2. uniMPSDK 作为小程序前端框架,仅支持使用 uni-app 开发框架开发的小程序,无法将已有的微信小程序迁移在自有应用中,也不支持在通过 uni-app 导出的 App 中嵌入小程序;
  3. FinClip 是一套小程序生态,通过集成 FinClip 的 SDK 并在后台中进行操作,开发者可以轻而易举在自己的 APP 中提供打开小程序的相关能力。而用户通过 uni-app 导出的小程序,也能够在 FinClip 中进行编译运行。

OK,冲着最后这一点而用户通过 uni-app 导出的小程序,也能够在 FinClip 中进行编译运行,决定搞一搞FinClip。

FinClip调研

看官网是了解一个产品的最佳实践:官网地址

image.png

生活中的体验

结合自己的生活中的经历,在APP里运行小程序的能力还是非常重要的。

目前支付宝APP的很多模块,点击之后都是小程序,体验很好。

站在开发角度思考,这么做能够和APP的开发、发布、运营解耦。站在用户体验角度,并没有比原生差的体验感受。

另外一个经历是美团:

因为我司是提供加班外卖补贴的,所以开通了美团的企业服务:美团商企通。用过的小伙伴应该会发现,这个功能一定是在APP中嵌套了H5,体验不好:经常性的出现加载网络失败、刷新页面失败等问题。

当时我就在思考:为什么美团不像支付宝一样搞小程序呢?

不知道美团商企通为啥没搞小程序而是用了H5;看了FinClip的官网介绍,我们能让自己的APP具有运行小程序的能力了,这样就能很好的避免APP嵌套H5体验不佳的问题了。

开搞

在搞清楚了FinClip的优势之后,决定开搞。

测试一下我们能不能很方便的把之前开发好的小程序直接运行到集成了FinClip SDK的APP上?

要跑通流程最简单的方式就是体验官方提供的demo了。

建议大家先看这里:熟悉官方流程

image.png

下载APP

在通读了一遍官方学习流程之后,果断下载了FinClip的APP。

在轮播图就看到了和我上文提到的uniapp的对比文章。可见还是有很多人关心两者的区别的。官方也专门写了文章来介绍区别。

登录后台

首先在管理后台,创建小程序,生成appID。

image.png

在开发者工具登录账号后,选择之前创建的APPid image.png

然后我导入了之前开发的微信小程序项目到开发者工具中:

image.png

首次运行的体验还是很不错的,从导入项目,到编译成功速度非常快,用时10秒左右。

简单体验了一下FinClip编辑器,和微信小程序开发者工具在日常使用上并没有差异,并未新增学习成本。

image.png

要在手机预览小程序效果,需要使用FinClip APP扫码 image.png

真机体验了一下,发现只有获取用户登录状态失败。(毕竟不是在微信上登录),其他功能体验起来还是非常流畅的:

image.png

真机测试后,发布到FinClip平台,看看效果,发现灰度发布的功能比较赞:

image.png

发现个问题

我下载了FinClip APP,登录了相同的账号,在web后台可以查看到,但是在APP的小程序管理中并没有看到我提交的小程序。

image.png

image.png

总结

我们了解到了FinClip的特点:快速集成运行小程序的环境,可以把微信小程序搬到自己的APP中。

了解到了FinClip和uniapp的区别:轻应用平台与前端开发框架

下载FinClip开发者工具导入微信小程序源码,体验FinClip IDE,进行了真机测试和代码提交。

同时了解到FinClip支持灰度发布功能,且支持灰度发布后的数据分析。

当然也发现了FinClip客户端APP的一个体验问题,不知道是我的打开姿势不对还是什么原因。

后续再花时间搞一个自己的APP,集成APP的SDK体验一下,踩踩坑。

欢迎连线

好了,花了一上午的时间体验了FinClip,整理出了这篇文章,也算是神来之笔了,今天就先体验到这里。

后续哪位同学的app的集成了FinClip的SDK可以联系我,关联我的小程序体验一波。到时候再输出一份协同开发的文章。

重要的参考资料

FinClip 开发者中心

FinClip 文档中心

FinClip github示例代码

FinClip 与 uniapp:轻应用平台与前端开发框架