如何基于vant进行二次开发
为什么要二次开发
最重要的一个问题还是效率问题，团队需要整体的UI风格，相同的配色，相同的功能组件，如果每个人独自开发那就大大浪费人力。虽然vant已经封装的不错了，但距离业务需求还差一点距离。第二点是设计师视觉走查的时候特别耗时，扣像素级别的问题，因此避免前端开发同学多次被折磨，做成统一的完事儿，同时也提升了走查的效率。归根结底，效率是第一生产力！
分类 前端 下的文章
iPhone手机播放audio音频的一些问题
预加载和自动播放问题
本以为预加载是一件理所应当的事情，有的音频文件这么大，不可能要等到用户点击播放按钮的时候才去加载，这肯定会存在延时问题。
Note: The preload attribute is supported in Safari 5.0 and later. Safari on iOS never preloads.
苹果官方技术文档解释：只有等到用户真正的点击页面才会去加载资源文件。用户触摸之前永远不会加载音乐文件或元数据。这是为了确保网页不会要求在移动设备上下载大量音乐或数据，这可能会占用大量移动数据。因此，无论您的代码有什么，预加载标签在移动 Safari 中基本上总是设置为“无”。
所以这里唯一的解法就是在交互上做一点处理，毕竟用户的网速不可控，在音频可播放之前显示loading状态，一直等到可播放为止。 那有什么事件说明可以播放了呢？一顿搜索，canplaythrough事件可以满足！
当终端可以播放媒体文件时触发该canplaythrough事件，估计加载足够的数据来播放媒体直到其结束，而不必停止以进一步缓冲内容。 caniuse 一查，主流大部分系统版本都支持。
当用户点击按钮后，发现还不能播放，那就loading等，一直等。如果播放播到一会儿网络卡了那么就在waiting事件监听。
神奇的currentTime
iphone手机下，如果在不恰当的时机设置currentTime（播放会跳跃到指定的位置），会导致后续设置currentTime无效。一定要在onCanPlay回调事件后设置currentTime才不会导致问题。
audio总时长
插播一个Android手机的问题，乐视手机出的一个bug
获取不到音频的总时长，以下方法没有一个能获取到
@canplay="onCanPlay"
@timeupdate="onTimeUpdate"
@loadedmetadata="onLoadedMetaData"
@ended="onEnded"
@loadstart="loadstart"
@durationchange="durationchange"
@canplaythrough="canplaythrough"
@loadeddata="loadeddata"
在用户没有主动点击播放按钮前，无论怎么样都拿不到，即使是setInterval 也不行。所以只能是在play后再显示总时长。audio的duration属性就是总时长，但产品功能上略有瑕疵，默认状态下显示不了总时长。
gulp构建小程序
截止目前为止，自己开发过不下十款小程序。算是有些经验，其实对于一个熟悉了前端开发的工程师，小程序的入门会非常简单，无非是要多熟悉些API和小程序的开发工具。本质上和写一个H5页面没有什么区别。
根据protobuf自动Mock数据的正确姿势
Protobuf
Google Protocol Buffer( 简称 Protobuf) 是 Google 公司内部的混合语言数据标准，他们用于 RPC 系统和持续数据存储系统。
Protocol Buffers 是一种轻便高效的结构化数据存储格式，可以用于结构化数据串行化，或者说序列化。它很适合做数据存储或 RPC 数据交换格式。可用于通讯协议、数据存储等领域的语言无关、平台无关、可扩展的序列化结构数据格式。为什么要讲到它，因为我们后台的协议就是用的它。
如何写一个微信小程序组件
背景
先谈下背景，在做一款产品的时候需要用到日期选择器，但是官方的却不太满足需求，因为无法选择农历啊。所以自己来造一个轮子好了，造轮子之前先想想啊，万一以后多个地方要用到，多个项目要用，怎么办呢？
那把这个轮子抽象，定义输入输出，即接口。组件里面怎么运转调用方不管啊，给了什么输入，就只管结果好了。
如何用svg动画打动一个女孩
研究SVG源于给女朋友做一个小礼物，这个创意也是从我同事那里抄袭过来的。当时看到就非常震撼，是个很不错的idea。
鹅厂web前端面试居然还有套路？
在鹅厂已经工作好几个年头了，从当年的新鹅转变为职场老鹅。我想从一个应聘者转变为一个面试官的过程来谈谈鹅厂的web前端面试。虽然说不上面试完全指南，但希望自己的这点经验可以帮到那些想加入鹅厂的同学，而且鹅厂也非常需要优秀的人才。
近期评论