代码改变世界

随笔分类 - javascript

h5 喜帖

2017-08-29 15:33 by stoneniqiu, 1209 阅读, 收藏, 编辑
摘要:地址:http://139.196.27.185:8088/ 因为国庆结婚,需要邀请亲朋好友,网上找了些电子请帖,但大都要收费,贵的还有好几百,有的效果还不太好。于是花了些时间自己写了一个。 就是swiper+css3动画。 https://files.cnblogs.com/files/stone 阅读全文

h5 录音

2017-08-10 20:33 by stoneniqiu, 10489 阅读, 收藏, 编辑
摘要:得益于前辈的分享,做了一个h5录音的demo。效果图如下: 点击开始录音会先弹出确认框: 首次确认允许后,再次录音不需要再确认,但如果用户点击禁止,则无法录音: 点击发送 将录音内容发送到对话框中。点击即可播放。点击获取录音即可下载最后一次的音频: 播放下载都是围绕blob文件。播放就是让隐藏的au 阅读全文

自动生成proto Js语句

2017-07-28 20:02 by stoneniqiu, 2491 阅读, 收藏, 编辑
摘要:在与后端的WebSocket通信时,前端要带一个proto文件是一个累赘的事情。首先是明显的曝光了协议实体对象,再一个浏览器客户端很容易会缓存该文件,新的协议更新可能导致客户端不能使用,另外在cdn服务器上还需要配置.proto类型客户端才能下载过去。真是遗毒不浅,自己使用的时候会注意这些,但给别人 阅读全文

UglifyJS-- 对你的js做了什么

2017-07-27 08:38 by stoneniqiu, 3622 阅读, 收藏, 编辑
摘要:也不是闲着没事去看压缩代码,但今天调试自己代码的时候发现有点意思。因为是自己写的,虽然压缩了,格式化之后还是很好辨认。当然作为min的首要准则不是可读性,而是精简。那么它会尽量的缩短代码,尽量的保持一行,最大化的减少的空白。我们常用的分号都会被替换成了逗号,短句变成了连贯的长句。 1.立即执行函数 阅读全文

【原码笔记】-- protobuf.js 与 Long.js

2017-07-10 18:19 by stoneniqiu, 4132 阅读, 收藏, 编辑
摘要:protobuf.js的结构和webpack的加载之后的结构很相似。这样的模块化组合是个不错的结构方式。1个是适应了不同的加载方式,2个模块直接很独立。webpack的功能更全一点。但如果自己封装js库这样够用了。而且模块对外统一接口 module.exports。这和node很像。 在处理超过16 阅读全文

微信上传图片

2017-05-26 20:40 by stoneniqiu, 2806 阅读, 收藏, 编辑
摘要:低版本的安卓上传图片是个问题,能出现选择图片,但点击图片后没有反应,转成base64也无解。于是改为用微信的接口上传。和之前的微信分享功能都是基于微信的jssdk。 步骤比我们平时上传到服务器多一步,他是先调用chooseeImage方法获得用户要上传的图片id。然后上传到微信的服务器,微信的服务器 阅读全文

vue2入坑随记(一)-- 初始全家桶

2017-05-17 08:52 by stoneniqiu, 13813 阅读, 收藏, 编辑
摘要:都说Vue2简单,上手容易,但小马过河,自己试了才晓得,除了ES6语法和webpack的配置让你感到陌生,重要的是思路的变换,以前随便拿全局变量和修改dom的锤子不能用了,变换到关注数据本身。vue的官方文档还是不错的,由浅到深,但是当你用vue-cli构建一个工程的时候,发现官方文档还是不够用,得 阅读全文

【JavaScript】让事件支持先发布后订阅

2017-05-06 09:04 by stoneniqiu, 1698 阅读, 收藏, 编辑
摘要:之前写过一个的事件管理器,就是普通的先订阅后发布模式。但实际场景中我们需要做到后订阅的也能收到发布的消息。比如我们关注微信公众号,还是能看到历史消息的。类似于qq离线消息,我先发给你,你登录了就能收到了。就是确保订阅该事件的方法都能被执行。 其实就是增加了几行代码。缓存下最后一次触发的时的参数。 然 阅读全文

websoket使用Protocol Buffers3.0传输

2017-04-26 20:26 by stoneniqiu, 2262 阅读, 收藏, 编辑
摘要:Protocol Buffers是Google推出的一个数据交换格式,相对于xml它的体积更小,更快,因为它是二进制传输的。3.0相对于2.0变动比较大。这些变动可以去看官方说明。 在前端使用ProtoBuf.js解析.proto文件,先需要再界面上引入protobuf.js。 定义一个.proto 阅读全文

【读书笔记】-- 你不知道的JavaScript

2017-03-24 08:37 by stoneniqiu, 1978 阅读, 收藏, 编辑
摘要:《你不知道的JavaScript》是一个不错的JavaScript系列书,书名可能有些标题党的意思,但实符其名,很多地方会让你有耳目一新的感觉。 1.typeof null "object"// true ES6中JavaScript的类型有:null、undefined、string、number 阅读全文

【webpack】-- 样式加载

2017-03-12 09:08 by stoneniqiu, 12128 阅读, 收藏, 编辑
摘要:加载css需要用到css-loader和style-loader css-loader将@import 和 url 处理成正规的ES6 import ,如果@import指向的是一个外部资源,css-loader会跳过,而只会对内部资源做处理。css-loader处理之后,style-loader会 阅读全文

【webpack】-- 模块热替换

2017-03-09 11:31 by stoneniqiu, 7496 阅读, 收藏, 编辑
摘要:全称是Hot Module ReplaceMent(HMR),理解成热模块替换或者模块热替换都可以吧,和.net中的热插拔一个意思,就是在运行中对程序的模块进行更新。这个功能主要是用于开发过程中,对生产环境没有任何帮助(这一点区别.net热插拔)。效果上就是界面的无刷新更新。 HMR基于WDS,st 阅读全文

H5缓存-Manifest

2017-03-02 08:47 by stoneniqiu, 5731 阅读, 收藏, 编辑
摘要:在app中更新h5页面一直有缓存问题。默认什么都不做的情况下,app有一定的空间缓存页面。一开始更新之后会马上加载,等到app缓存空间上来之后更新就无法下载了。安卓能够清理缓存空间,ios就只能卸载重装(are u kidding me?)。这是最坏的情况,你可以更换下地址。 no-cache 注意 阅读全文

【webpack】-- 自动刷新与解析

2017-02-26 23:53 by stoneniqiu, 19043 阅读, 收藏, 编辑
摘要:前端需要频繁的修改js和样式,且需要根据浏览器的页面效果不断的做调整;而且往往我们的开发目录和本地发布目录不是同一个,修改之后需要发布一下;另外一点就是并不是所有的效果都可以直接双击页面就能看到,我们常常需要在本地用nginx建一个站点来观察(自己电脑上ok了才放到测试环境去)。所以如果要用手工刷新 阅读全文

【webpack】-- 入门与解析

2017-02-20 23:31 by stoneniqiu, 1557 阅读, 收藏, 编辑
摘要:每次学新东西总感觉自己是不是变笨了,看了几个博客,试着试着就跑不下去,无奈只有去看官方文档。 webpack是基于node的。先安装最新的node。 1.初始化 安装node后,新建一个目录,比如html5。cmd中切到当前文件夹。 安装node后,新建一个目录,比如html5。cmd中切到当前文件 阅读全文

【读书笔记】-- JavaScript模块

2017-02-14 23:36 by stoneniqiu, 918 阅读, 收藏, 编辑
摘要:在JavaScript编程中我们用的很多的一个场景就是写模块。可以看成一个简单的封装或者是一个类库的开始,有哪些形式呢,先来一个简单的模块。 简单模块 用IIFE创建一个闭包,隔离作用域,避免变量相互干扰。得到foo对象可以直接用了。这种适合小的模块,比如在ag中的写Service。 (functi 阅读全文

【JavaScript吉光片羽】--- 滑动条

2016-12-24 23:03 by stoneniqiu, 605 阅读, 收藏, 编辑
摘要:灯光的亮度控制需要一个滑动条,先借用lamp源码中Bar: var Bar = function (opt) { var defaults = { $id: "", // 进度条dom节点id min: 1, // 刻度最小值 stepCount: 5, // 刻度步数 step: 1, // 刻度 阅读全文

【JavaScript吉光片羽】遭遇IE8

2016-11-27 10:28 by stoneniqiu, 766 阅读, 收藏, 编辑
摘要:最初对做兼容性的认知只停留在UI层面,但其实UI层面都还好,因为毕竟你可以直接看得见现象,更为重要的是在JavaScript层面,因为这个部分涉及到功能性,前者最多是体验性的问题。下面扯一下这几天遇到的IE8相关的兼容性问题。 1.所有$.ajax失效 刚开始看到的现象是IE8/9页面切到了留言页面 阅读全文

H5嵌入原生开发小结----兼容安卓与ios的填坑之路

2016-11-19 08:29 by stoneniqiu, 22500 阅读, 收藏, 编辑
摘要:一开始听说开发H5,以为就是做适配现代浏览器的移动网页,心想不用管IE了,欧也。到今天,发现当初too young too simple,兼容IE和兼容安卓与IOS,后者让你更抓狂。接下来数一下踩过的坑。主要分UI展示,键盘,输入框等等。解决bug最苦恼的问题不是没有解决方案,而是你没有找到真正的原 阅读全文

H5图片压缩与上传

2016-10-14 08:40 by stoneniqiu, 31061 阅读, 收藏, 编辑
摘要:接到需求,问前端是否可以压缩图片?因为有的图片太大,传到服务器上再压缩太慢了。意识里没有这么玩过,早上老大丢来一个知乎链接,一看,原来前辈们已经用canvas实现了(为自己的见识羞愧3秒钟,再马上开干)!。 canvas压缩 使用了github上的一个现成库:https://github.com/s 阅读全文