微日记-20171028

天气阴。 北京的街头开始吹起熟悉的风,阴层的天,似乎不适合加班。 是的,冬天就这么来了,和同事讨论是不是冬季衣服的也该拿出来。不过感觉雾霾天还是相对于天津,北京来的似乎早些。对比去年空港,至少10月末还是持续很好空气,晚上出去跑步,明显能见度好很多。似乎距离上一次去天津已是半年,最近天津图书馆火了,真的好想什么时候再去一次。 最近读《软件开发本质论》发现写了很多规则的东西,其实读着会有很多熟悉的地方,但是后来才发现,现实生活中难得是落到实处,落到每一次的任务中。最近读《中国文学史》才发现,真的文字的魅力远远超过于平日的交谈,它是日常的凝练,是艺术层次的浓缩。几行字,几个段落,便能轻易的触动人心。既可以平铺直叙的叙事,又能巧夺天工的修饰。于情于物都能展现出自己收放自如的力量。真的很棒。 回议者,固然让人心里沉重。更多的还是重复记忆下过去究竟留过那些伤痛。去年十月底返京,和Qsir一起参加,适逢Jun姐北京 京东方出差,似乎在火车南站刚好错过,希望今年能叫他们补偿我的那顿火锅。10月最后和超哥一起吃饭聊 什么促成了这个决定? 因为发现自己不适合了。当你走着走着发现原来自己不适合眼前的这条路。这对于一个人的人生观是坍塌的表现,似乎所有的外因还是抵不过,内心的诉求。晚上和 辛 回家,路上相顾无言, 详情 »

查看详情

使用 webpack-visualizer 进行打包模块分析

我们现在已经非常习惯使用 Webpack 进行 JS 模块的打包处理。当然有的时候我们在优化代码的时候需要对所引用的模块进行体积分析,从而进行代码优化。当然这些工具有很多了,今天主要说下 webpack-visualizer。 webpack-visualizer 是一款 webpack模块分析插件,使用非常简单,你只需要: npm install webpack-visualizer-plugin --save-dev 然后编辑你的 webpack 配置文件: var Visualizer = require('webpack-visualizer-plugin'); //... plugins: [new Visualizer({ filename: './statistics.html' })], //... 然后打包的时候会在 打包目录下生产一个静态网页 statistics.html.打开你就可以看到各个模块的百分比,以及压缩包大小了。 详情 »

当红男演员演技排行榜

本排名纯属个人看法,如有雷同,纯属抄袭 第一档 演技出色,台词功底强 李雪健 范伟 黄渤 文章 王宝强 吴刚 第二挡 演技不错 稍逊一筹 胡歌 靳东 邓超 张嘉译 黄磊 董子健 第三档 有点演技,角色毫无印象 陈赫 黄晓明 林更新 霍建华 赵又廷 陆毅 吴磊 张一山 第四挡 演戏基本靠喊,容易出戏 吴亦凡 鹿晗 李易峰 张翰 等等 详情 »

微日记-20171017

天气阴。 10月返京已是冬天,眼看都快一个月没有更新,就记下流水账。 Player 项目算是进入稳定迭代和策略调整的阶段, Bug几乎都快修复的差不多了。说句实话会觉得 PD 这个角色的经验和执行力不怎么足,事件响应不是很快, 以致于我们 Team的成员在家都得 fix 和 release. 开源项目的部分,这是第二次提起,自己有时间一定会去看大家的 feedback 和提起的 issue 但是,最近确实项目脱不了手,自己一般都会 review 提出来的 PR ,而且项目既然开源了,也希望自己有能力去进行下一步开发。 最近是 S1 的自评,自己看了看当初写的年初计划。发现让人高兴的是 Github 和 绘画以及旅游都有做到,目前比较紧急的是说好50本书,需要年终抓紧点了。 详情 »

查看详情

使用 media query 进行 IE 的 CSS Hack

尽管现在很多大多数现代浏览器对 CSS3 的诸多特性已经开始支持了,但是有的时候我们还是避免不了对低版本的 IE 浏览器进行兼容性的样式写法。常见的思路无疑是写注释性语法: <head> <!--[if gt IE 9]><!--> <style> // your style rule </style> <!--<![endif]--> </head> 关于IE 注释性语句可以看 这里 当然你也可以通过 JS 进行 UA 测判断,然后在 body 加上 ie的 class ,然后在样式里进行限制。 .ie .container{ .... } 当然今天得重点是通过 media 详情 »

查看详情

解决新版本 Chrome 提示 DOMException: The play() request was interrupted

解决新版本 Chrome 提示 DOMException: The play() request was interrupted 解决新版本 Chrome 提示 DOMException: The play() request was interrupted 大概在一些新版本的浏览器中,我们是用 audio 或者 video 进行媒体资源播放的时候,可能会在控制台看到这个输出: Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause(). Or Uncaught (in promise) DOMException: The play() request was interrupted by a new load request. 如何触发? < 详情 »

查看详情

IE vs Chrome vs Safari video 的预加载表现分析

我们知道在 video 的标签中支持 preload的属性, 它表示可以 用于定义视频对于媒体资源的预加载从而达到更好的播放体验。它可以设置下面属性值: auto 表示整个视频都会进行下载,即使用户并不打算播放它。 metadata 只请求视频信息的 metadata 数据,比如长度。 none 不停止视频资源预加载。 测试表现 Chrome *版本: 61 * 我们测试Chrome设置为 auto 的时候加载数据大约为 (3.6M / 20.1M) Preload Size auto 3.6M / 20.1M none 0 M / 20.1 M metadata 896 KB / 20.1 M Safari 版本: 11.0 Preload Size auto 20.1M 详情 »

查看详情

MacOS High Sierra Safari 11限制了 video 自动播放

前些天 Apple 正式向用户推送了他们的新一代 Mac OS MacOS High Sierra 。这次带来了新的 Safari 浏览器,然而一个不好的消息,是 safari 重新制定了新的限播策略。点击这里 了解上个版本的播放限制策略调整。 现在网页用包含 video 或者 audio 的标签,如果涉及了 autoplay 属性,浏览器现在不再进行自动播放,而用户需要在 url 的状态栏进行设置(右击就好): 里面会有三个选项: 允许自动播放 永不自动播放 停止播放含有声音的媒体 官方也给了建议,你可以通过代码来监听是否自动播放: var promise = document.querySelector('video').play(); if (promise !== undefined) { promise.catch(error => { // Auto-play was prevented // Show a UI element 详情 »

查看详情

微日记-20170917

天气晴。 距离上一次随笔,已经是10天左右了。从杭州回来了,就开始加班加点进行 IE Bug 上的调整。随后是播放策略和对外输出的接口能力支撑。感觉这次挑战还不小。 去杭州的时候,和继稳聊了很多。关于技术,工作,未来,定居,情感。他说: 大概每个阶段都开始有自己的目标,觉得落实了工作,落实了婚姻,现在就得想着房子,大概未来几年都是这个目标吧~ 自己想了想何尝不是,认识所处阶段,三年一个阶梯,读完了初中,来到高中,从大学毕业三年,希望翻过另外一个阶梯。 然后 做的 avatar 其实想说下具体的每次出图会经历的流程: google up moive -> dribble search pink dress -> open PS -> visit behance -> paste images -& 详情 »

记一次 JS 代码压缩后产生的 Bug

最近遇到了个平时很少遇到的 Bug,理论上代码压缩混淆后大多数都不会存在问题(之前确实没有遇到),但是最近却不小心给遇到了。 大概在测试的时候,没有混淆前,代码是可以正确执行的,但是混淆后,代码就出现部分 JS 未顺利执行的情况。然后通过代码一步步调试,发现,在进行混淆的时候,会把一些变量命名转化成类似字幕 a, b, c等这样。然后这次在组件注册的时候,比较偷懒,用了 Function.name 来代表注册组件的名称,而不是独立命名。 自己在 ES6 偷懒这样写了: import PlayComponent from './play-component'; // ... ui.register(PlayComponent); // register 的实现 ui.register = function(func) { const name = func.name; } 这样就导致在压缩的时候的 传入的参数会变成 t 这样就会知道命名失效,始终都是 t 。 所以在实现的时候尽量少用 Function.name 详情 »