liusaint1992的专栏

https://github.com/liusaint/ls-blog/issues/44

微信小程序开发的时候，很多接口都不太能信任，需要作一些额外的兜底处理。保证程序在什么情况下都能尽可能健康的运行。 也要有一套健全的异常收集反馈机制，方便迅速发现问题解决问题。 小程序生态的异常监控体系，主要包含小程序后台的代码运行报错，小程序告警群的使用，具体用户的信息收集上报，代码逻辑中可能的预警上报统计，微信新版本的内测跟进等方面。1.css支持。在ios12上 css3的支持不够好。有时候动画animation的forward无效。现象是动画结束后突然回到初始状态。极少数ios机型会出现a

最近在用cocos动画引擎写应用，为了优化性能封装了一个分帧加载的处理，简单讲就是拿到数据之后不一次性把数据展示出来，而是每一帧展示几个节点出来，每一帧作的操作少，应用体验更流畅。1秒大概是60帧，每帧大概是16ms，一帧中做的事情太多，执行时间太久，就会导致卡顿掉帧。 由于js是单线程，单个操作耗时不宜太久，要及时把线程让出来，对庞大的任务就需要作任务分解，异步执行。cocos项目或是传统前端项目，都可以利用异步的思想来分解任务，优化性能。封装一个任务队列，每次不直接执行任务，而是把任务往任务队列里

写了一年小程序，每天接受数万付费用户的考验，踩过小程序的坑数不胜数。先写一下视频篇，写一些会影响到用户正常看视频功能和影响业务主体流程的坑。1.一些低端设备无法播放高清视频 1080p需要接入转码,提供2种分辨率的视频。如果检测到播放高清视频报错，自动切入低清视频。也有可能高清视频播放不出来，也检测不到报错，所以还需要一个按钮来手动切换标清视频。问题现象是在有些设备直接播不出来，在有些设备上是有声音但黑屏无图像，可能会报一些类似MEDIA_ERR_DECODE(-4003,-1)这样的报错。2.同层渲

很多少儿英语启蒙学习的程序都有26个英文字母大小写笔画绘制的功能。小朋友可以跟着提示，一第一笔的将一个字母写出来。这里解析一下该功能实现流程。有一些初步的预想后，参考了竞品，流利说少儿英语，lingokids等。对流利说少儿英语的分析流利说的字母笔画教学，每一笔看起来都很自然，就像是人手写的一样，仔细看会发现，每一次写同一个字母写出来的字都是一模一样的，其实它是有一些预设的轨迹，当用户的触点...

我们在做很多学习或者游戏类的小程序的时候，经常会有一个场景，在正式进入学习之前，把所有需要的音频图片等资源下载好，这样在学习过程中，会有一种近乎离线学习的体验。这是学习产品中很重要的一个环节。这里总结一下，如何实现一个相对完善的资源加载环节。我们假定会有100个左右的图片音频下载。1.下载并发限制如果我们一次性发100个下载请求，小程序毫无疑问会崩掉。按照官方文档小程序一次性下载的最大数量为...

1.IE下的console的bug。2.使用window.onerror在不打开控制台的情况下弹出错误信息解决一些不方便打开控制台的bug。

使用Chrome调试工具的一点经验。 未完待续。

一些个人作品的目录

1.img,iframe等标签2.JSONP3.CORS4.服务端代理5.form,iframe与服务端配合。

最近越来越感觉到正则表达式的强大，可以简化很多代码。并且正则表达式入门并不是很难。简单列一下JavaScript中使用正则表达式的一些方法。//定义几个会用到的变量var href = 'baidu.com?where=b5s&a=b';var regObj = /(\w+)=(\w+)/;//全局搜索var regObj1 = /(\w+)=(\w+)/g;正则对象上的方法1.regObj

开发一个简单的chrome插件。实现content script与插件的通信。点击插件图标运行插件，可以让页面上所有的a标签添加一个target="_blank",让页面在新标签页打开。

本文介绍使用订阅发布（观察者）模式在使用ajax请求的数据来初始化的控件中的运用。

隐藏div滚动条，但是保留滚动功能。

总结一种JavaScript debug方法

IE下面的一些坑的总结

placehoder jQuery插件逻辑。jQuery $valHook $propHook的使用。

做英语学习类产品经常会遇到读句子的时候针对单个单词的类卡拉ok的高亮效果。 这里记录一下音频进度和单词的一一对应关系（类似于歌词文件，粒度为单词级别）如何生成。纯人工来校对的话人工成本还是比较大的。 专业的词语是强制对齐（Forced Alignment）。这里介绍python库aeneas，可针对每句或每个单词的时间节点的json文件，还可以批量操作。准确率还不错。文档：https://gi...

微信 jssdk 本地调试方案微信公众号开发接口配置需要一个外网能访问的域名。localhost不在这个域名下,wx.config会失败。如果每次修改都发布到测试环境，又太影响开发效率。总结一下除了直接上测试环境之外的两种本地jssdk调试方案。1.使用内网穿透工具让外网能通过某个域名访问到我们本机的localhost。从而实现在本机上修改看效果。参考 https://...

1.sql注入。在用户的输入被直接动态拼装sql语句时，可能用户的恶意输入被拼到了sql语句上，而造成了一些恶意操作。比如查询到一些数据甚至删除一些数据。一般应对方法是对sql语句进行预处理。 thinkPHP防sql注入：https://www.kancloud.cn/manual/thinkphp/1844#2.XSS Cross Site Scripting。跨站脚本攻击。...

前端开发，有一项很重要的基本功，就是在大型项目中，比如几万行js代码中，迅速找到新增功能或调试bug的切入点。特别是你只是接手这个项目，并不了解其中每一个功能点所在的位置，也没有时间一行行读代码的情况，这个基本功显得尤其重要。　这项能力除了娴熟的调试工具使用技巧，更重要的还是对变化的观察力和总结归纳的能力。本文用一个讲一个功能案例的实现。功能背景一款大型canvas应用。我们使用了一些...

前端性能优化总结

一次性把所有的问题加载出来。就在问题列表页面添加取消关注功能。chrome插件

创建对象//1.字面量var obj1 = {}//2.构造函数function A(){}var obj2 = new A();//{}//3.Object.create()var obj3 = Object.create(obj1)构造函数与实例//构造函数。与普通函数的区别只是调用方式。所以一般约定首字母大写。function A(){ this

IE9中console的坑以及修复，修复失败以及console的出现时机

一个常见场景，点击保存，获取表单数据，发送请求。一种防重复点击的策略：点击按钮，出现遮罩，提交请求。。。能不能保证只提交一次请求呢？未点保存时页面处理很卡没有响应的情况呢？点了保存后的操作导致页面无响应时继续点保存呢？在表单超复杂，用户的系统配置低的情况下，获取表单数据可能会花很长一段时间，甚至让浏览器停止响应，这时保存操作导致浏览器停止响应而我们又再次点击了保存按

My97DatePicker是很不错的一个日期选择插件，体积只有几十k但是功能非常强大。官网：http://www.my97.net/能满足很多苛刻的要求。My97DatePicker　如果两个输入框，第一个不大于第二个，都不大于当前日期，两个输入框之间的时间不超过30天。做法。如果第二个直接设置比第一个大的范围不超过30天，那么遇到算出来的日期大于当前日期的情

最近网站备案通过了。可以放一些示例代码在上面了。查看之前写的文章。想把demo整理出来放上去。发现之前写的代码还是有很多不足的地方。之前写代码，更注重功能的实现。对重用性和模块化的考虑相对比较少。纸上得来终觉浅，决定重写一下之前文章里写过的这个效果。My97DatePicker两个日期范围不超过30天，第一个小于第二个，都不大于当前日期picker1.js   va

天地图行政区域划分，天地图热力图，天地图热点图的替代解决方案。

本文介绍如何在天地图上绘制电子区域（电子范围或电子栅栏），并且，我们要将我们绘制的电子区域的坐标数据保存到数组里，以用于提交到后台，或根据数据来绘制电子区域。 天地图中有绘制多边形的接口跟绘制矩形的接口。 我们就从这里入手。调用接口其实不难。这里稍微要绕一下的地方是如何在调用 绘制多边形接口的同时把我们绘制的多边形的顶点坐标保存下来。

我们就实现了在天地图上显示坐标轨迹。可以根据后台查询出来的数据在地图上显示轨迹。

本文主要讲：1.根据数据在天地图上用不同的图标循环添加标注点。2.循环给标注点添加事件。我们这里添加的事件是鼠标移动到标注点上，悬停0.5秒钟，浮出信息窗口显示此标注点的详细信息。 鼠标移出标注点，信息窗口消失。3.在标注点下显示出标注点的名字。

最近公司的项目到了尾声。总结一下项目中的一些技术。其中有涉及到天地图的部分。 类似百度地图，google地图。 我们要用一些它的公共接口，实现一些我们的效果。  比如在地图上显示我们的设备的位置，范围，运行轨迹等等。本文实现加载天地图。

之前看的《JavaScript》语言精粹，重温并写笔记。笔记中包含书中重点和自己的一些补充及思考。

js群里讨论的一个小算法。

检测onbeforeunload返回结果，在检测到取消离开页面后执行操作有时候，我们需要知道我们在window.onbeforeunload中点的确定还是取消。 当用户点取消的时候我们要执行一些操作。 比如，我们有一个带效果的菜单，然后我们点击了菜单的一个标签，菜单的突出效果执行到了新的 一个 标签 上面去， 但是这个时候页面阻止了我们离开页面，并且我们取消了离开页面， 那么我们就要恢复 菜单的状态。 把新的标签效果恢复到旧的标签 上去。

本文记录根据卫星仰角和方位角使用html5绘制天空图（投影图）。也就是根据这两个角度绘制坐标点在圆形上的投影。

本文是使用了jQuery来用自定义图片代替原生checkbox复选框实现全选，删除，表单提交。

本文再讲一点复杂操作。1.在地图上展示一些标注点，这些标注点两两相连。 在线与不在线是两种不同颜色的图标。2.如果标注点之间距离大于60千米，用红色虚线连接。如果标注点之间的距离小于60千米刚用蓝色虚线连接。3.点击线条，在两个标注点显示两个标注点的距离，将两个点用实线连接。并且给相连的两个标注点大图标来表示，大图标也根据在线不在线使用不同的颜色。点击此标注点的时候，其他标注点恢复原状。4.输入起点和终点，地图上连接两个点，并用实线连接两个点，两个点的图标用比较醒目的图标。

1.尽可能把所有的标注点放在我们地图的可视范围内。2.在满足1的情况下，让缩放级别尽可能的高，以使我们可以看到更多的信息。为了满足上面的需求，实际上就是要我们根据所有的标注点的经纬度，分析出初始化地图时的 地图中心点 和 地图缩放级别。