关于小程序 “Crontab 助手” 的几点说明

记得新年讲单词的时候，提了下新年 resolution。其中一个就是独立的做一款小程序。一年快过半就匆匆开始着手。随着二宝月龄增大，晚上写代码的时间也变多了 crontab助手才匆匆得已完成。开发过程虽没有什么大波折，但有些经验也值得分享。本文就采用访问的形式把自己的浅见分享给大家。还没使用的同学可以先识别玩玩先。

为什么要开发Crontab助手？

首先 pshu 自己在 crontab 上犯过错，需要一个工具傍身。第二虽然有很多基于web的crontab工具，但是有些有bug，我就刚好可以做一个小程序练练手。

大家不要觉得我是在填补空白，其实小程序发展这么久都没人做，说明需求其实不大。毕竟大家没有这么多复杂的crontab要编排。

这里还是要严肃的说明下，crontab助手的算法和 UI 都很大程度上参考和借鉴了 crontab.guru ；crontab.guru 也帮我解决了很多 crontab 方面的问题，在此感谢！

那为什么在 UI 上下加了一个日月变换的动画呢？

因为 crontab 本身是比较 geek 和无聊的事情，所以加一个动画增加一点乐趣。动画参考的是  https://codepen.io/shalanah/pen/mLZRJo

采用什么框架开发的？

Tarojs，采用React的方式来写小程序。pshu还是比较粉 React 的。也占了 React 的 Learn Once, Write Everywhere的便宜。

觉得tarojs总体体验打几分，有什么坑要注意的？

8分，满分10分。

1分: 是因为不支持functional component 和 hooks。用起来有种刚接触React时的笨重历史感。

另外一分就是：每个jsx，tsx文件只能定义一个react组件；而且每个组件的 render 只能有一个 return。也就是如果你有一个 render 依赖一个 boolean 的话，就需要写成三元表达式。

其他8分是为什么呢？

那就多了

• 对 React 选手友好，无缝切入，学习成本很低。

• 有一套 Taro-UI 特别适合我这样的前端半吊子。

• 支持ts/tsx，写起代码来贼溜。是的, crontab助手就是全tsx的。

• 支持less/scss，crontab助手的那个日月变化的动画就是仰仗scss方便的调参数。

• 同是支持编译到 H5 和 React Native。关键是能编译到 H5，这样样式动画可以在浏览器里面调试好然后再去小程序开发工具里面调整下就好了，开发效率很高。最好有hot-reload极度引起舒适。

crontab助手的执行日期需要依赖网络加载，为什么啊？

在 Crontab助手 开发的过程中，一开始计算“执行日期”的算法效率很低（通过一分钟的 step 来遍历每个时间点来找匹配的执行时间），如果放在小程序的代码里面会卡死 UI；我就把这部分的功能放到网络 API 上了。后来优化了一个版本复杂的 crontab 500ms内也能算出最近 5 次执行时间。等算法改进了差不多了，会放到小程序本地计算了，响应速度会变快；目前有算法上的 bug 会通过更新 API 来完成，用户不需要更新小程序，虽然没什么用户。（尴尬的呵呵呵 ）

而这个 API 托管在 ZEIT 云平台上，所以会一直保留。作为程序员想通过 cli 的方式来访问的话，可是试试下面的例子,记得要安装下 jq （shupengfei 是 pshu 的名字全拼 ）。

$curl -L crontab.shupengfei.me?crontab='3 1 4 1 5'  2>/dev/null | jq
{
  "crontab": "3  1 4 1 5",
  "nextDates": [
    "2020-01-03 01:03 (周五)",
    "2020-01-04 01:03 (周六)",
    "2020-01-10 01:03 (周五)",
    "2020-01-17 01:03 (周五)",
    "2020-01-24 01:03 (周五)"
  ]
}

在开发小程序时有什么其他 Tips 和大家分享的？

哦，有个微信开发者工具的bug。某些情况下 wcss 会失效, 无论怎么重新编译样式都无法生效。这个时候 pshu 的办法是：先删除项目，然后重建，基本就能解决。估计如果你有其他的诡异的问题这个方法能解决个大半。

最后还有什么和公众号的粉丝说的？

最后一个问题了啊！如果会 React 的同学一定要试试Taro.js；不会 Recat 的同学可以，先学了 React 再来用。还有就是 Crontab 助手有个彩蛋，提示就是：“福报”。大家来找彩蛋吧！