052018.11

日志 什么样的产品算优秀?

在香港过十字路口时,红绿灯会响,慢响表示等待,快响表示可以通行。红绿灯不像大陆那么高,给车看,而是矮墩墩的,等的人可以按。一盏红绿灯,红色代表停,绿色代表行,但是如果是有红绿色盲的人呢?所以,红绿灯除了要有颜色状态之外,还要有声音状态,还要有静动的状态。

谈论一个产品是否优秀,是从它的外观考虑?从档次考虑?从价格考虑?还是从实用性考虑?都不是。一款优秀的产品,它的灵魂决定了它的它的用户是否可以热爱它,忘记它,把它融入自己的生活。什么是一款产品的灵魂?是它抱着怎样的价值观,以怎样的形式,为自己的用户服务。

灵魂,它的本质是爱,是仁,是对这世界的期待。它期待这世界变得美好,它期待这世界温柔待它。

一款优秀的产品,当它离开它的设计者的手,它就有了自己的生命。它所传递给用户的,是关爱,是拥抱,是对未来的向往,它就像黑夜里不烈不晃的光,它照亮路人前行。如果问这世界上,怎样的产品算一款优秀的产品,或许,它被注入了创造者最温柔的一面吧。

23:57:26 已有0条回复
032018.11

日志 在iphone上写代码是怎样的一种体验?

说到写代码,好玩又有趣,心里有个想法,创意突然冒出来的时候,能不能马上把创意用代码表达出来呢?一台iphone满足你的这种需求。为了体验在iphone上写代码,我专门录制了一个视频。

视频中提到的软件有textastic,coda,codeanywhere。

另外,视频中关于local-remote的逻辑,我后来仔细想了一下,其实和filezilla的操作逻辑是一致的,我们在pc上使用sftp编辑远程文件,如果sftp软件不支持在线编辑,那其实和视频中的逻辑其实是一致的。

12:25:27 已有0条回复
012018.11

As wanted to programing on iPhone, I installed a application called Buffer Editor which costed me ¥60!! After a while using, I just want to say: what the fuck of this ¥60 shit!!!

  • the shit UI which costed ¥30 unless the logo icon
  • the shit features' usage costed ¥28 which make a coder like a foolish
  • the left ¥2 given the author, go back home and wash your mind for 10 years

At last I have to install Textastic instead which cost ¥68. Both ¥60s, why your distance so much long? Even though Textast is less of features, the UI and the operation logic is like silk. 

For all application developers: make your production worth for users, don't lose your face in public.

14:23:27 已有0条回复
242018.10

iMac升级之后,electron rebuild sqlite3失败

macOS出了新的版本,启用暗黑主题之后各种不习惯,又切回原来的主题。今天在build electron应用的时候,先是直接报错,不能electron-rebuild,接着发现sqlite3 rebuild失败了,各种坑。

解决这个问题先要:

sudo xcode-select --install

这样可以解决electron-rebuild无法使用的问题。接下来,修改rebuild sqlite3的命令为下:

electron-rebuild -f --module-dir ./node_modules/sqlite3/

也就是说之前的--which-module参数现在不好用了,必须通过--module-dir来明确指定目录路径。相信后面应该会修复这个问题,现在暂时这样解决了。

20:20:41 已有0条回复
122018.10

文件选择框,只选文件夹

文件选择器,多选,只选择文件夹,根据需要挑选属性即可

<input type="file" webkitdirectory directory multiple/>
09:54:18 已有0条回复
292018.9

怪异空格引发的血案

在整理博客的过程中发现博客内有部分地方没有对齐。于是赶紧打开devtool看下。结果发现了神秘而怪异的现象。明明没有打空格的地方,却出现了实体&nbsp;真的是着了魔般,怎么都干不掉。

二维码和下面的文字没有对齐,查看后发现图片没对齐

第一反应是css出了问题,于是打开devtool试着调试css。结果,怎么搞都没办法。仔细去看HTML,发现出现了两个&nbsp;。

可是我很清楚,这地方源码里面没有空格啊。于是想到自己的网页是经过ob content输出的,是不是php处理上出了什么问题,然后去翻开插件看,可是怎么读代码,都觉得应该不是这个问题。

于是又去看下网页源代码,怪异的事情发生了,明明网页源代码里面没有&nbsp;啊。

难道是\t的问题?于是把源码中的这个地方删掉重新换行,结果,仍然还是这个问题。直到我开启了vscode的空格显示功能,才发现了异样。

你仔细看<img>前面的空格,发现这两个空格的宽度感觉很奇怪。于是删掉,自己打了两个空格,问题解决了。

正常的空格[ ],奇怪的空格[   ],请查看源码和在devtool中查看。

原来这两个空格是全角空格,也就是中文格式下的特殊字符。但是,这个空格在键盘上是打不出来的,要通过特殊的输入方式才能打出来,这是怎么产生的呢?我不可能写代码的时候,还这样去特意打两个全角空格吧。最后,看来是在不同的系统切换,不同的环境下,切换编辑时,留下的问题。

23:11:21 已有4条回复
  1. 你这个情况,我博客上也有,不过仅限 Mac 和部分 Windows 之间。
    比如我明明正常输入的一句话,在某些 Windows 下会看到句子里出现类似+号的奇怪字符。
    自己的Win 8.1 和 公司的 Win 10下会看到,但有的读者说他们并没有看到,所以也不知道是什么机制了。
    #612 Betty 2018-09-30 11:28 回复
  2. 上班时间逛博客,小同学,需求不包含啊😝
    #613 回复给#612 否子戈 2018-09-30 11:32 回复
  3. 上班时间回评论,大同学,你需求不包含啊

    我是今天休假了,要对自己好一点,哈哈哈
    #614 回复给#613 Betty 2018-09-30 11:36 回复
  4. 提前休假真爽啊,岂不是要出去浪了
    #615 回复给#614 否子戈 2018-09-30 11:44 回复
282018.9

网页特效:散动的blobs

192018.9

最新的 iPhone 屏幕分辨率大全

182018.9

一个可能摧毁微信的二维码

今天群里红了一个二维码,扫这个二维码之后,手机就会出现自动重启的极端情况。经过测试,只有iphone上的微信会出现这样的问题,而安卓微信则幸免于难。

会让微信崩溃,手机重启的二维码(想清楚再扫哦

瞬间这个二维码就在朋友圈儿红了,比如有人说这是个体验新产品的入口啦,有人说这是个幸运的抽奖啦,有人说这是个领红包的口令啦,等等,于是就开始有人试了,从此,两人恩断义绝,再无瓜葛……

作为有志向的程序员,当然要一探究竟了。先解码二维码,然后去看对应网页的源代码,于是呼撸,原来就是非常简单的嵌套黑洞。点击这里可以看源码的真正出处,放心,点进去没影响。

这是苹果给自己挖的坑。iOS用的网页排版引擎WebKit有个弱点,而这个引擎是苹果要求,所有app所有浏览器必须用的。只要在CSS的Backdrop-filter里嵌入大量元素,比如<div>标签,就可以耗尽设备的所有资源,造成内核错误(Kernel Panic) 。后果就是,关闭操作系统并重启,以避免设备受到伤害。只要在iOS上渲染了HTML,这15行代码就有效。

看完源代码,你懂了吗?

23:21:20 已有0条回复
142018.9

ng-scroll

angular没有自带ng-scroll,只能自己写个directive来代替:

module.exports = ['$parse', ($parse) => {
  'ngInject'

  return {
    restrict: 'A',
    link: (scope, element, attrs) => {
      element.on('scroll', () => {
        let scripts = attrs.ngScroll
        let parse = $parse(scripts)
        parse(scope)
        scope.$apply()
      })
    }
  }
}]
18:02:20 已有0条回复
132018.9

之前在谈体验的时候,更喜欢react,因为它更接近元编程,而vue则是在follow一套规则的前提下,像摆弄器件一样去组装出一个东西。但是经过一年多回头来看,虽然react更多体现在思想层面的先进,但在快速实现应用的需求中,vue更胜一筹。如果现在让我去选择,我会毫不犹豫的马上拿起vue开始撸,虽然让我写react也完全没问题。

顺带吐槽,苹果自带的中文输入法,联想能力真的弱到爆炸,错别字一堆一堆的!!

09:54:19 已有0条回复
092018.9

给博客改了字体,在mac上显示瘦瘦的,怎么说呢,其实现在这个字体也挺不怎么合我之意,有点太细了,不稳重。但是默认的字体实在是有点不能接受,要是有特别是中文字体,挺难求的,而且还要免费,也是……

01:45:51 已有0条回复
062018.9

前端录制麦克风音频

在前端去录制麦克风音频,听起来好简单啊,但是后来发现是个大坑。这个问题要分解:

  • 麦克风
  • 音频
  • 录制

获取麦克风输入比较简单,用webrtc的接口getUserMedia就可以实现了,但是怎么录制?getUserMedia得到的是stream,stream不是buffer,也不分chunks,所以你想要把stream转换为buffer,没办法,必须还得靠高级api。MediaRecorder本来可以用,但是safari不兼容,内心MMP。录制视频用canvas一帧一帧保存起来就行了,但是录制音频……最后找来找去,AudioContext这个api可以用,但是safari只有在11.2版本之后才支持webkitAudioContext,所以,只有用这货才能实现。

总结,在支持MediaRecorder的系统中使用MediaRecorder录制,在iOS中,最多兼容到使用webkitAudioContext去实现,有一个包可以用,就是audio-recorder-polyfill,想法真不错,赞一个。

13:06:34 已有0条回复
222018.8

今天看到消息称,网易博客将在18年11月30号全面关闭。我最早使用网易博客,也不过是2008年,大概写了两三年之后,就厌烦了浮夸的界面,和莫名其妙的广告,并且开始维护自己的独立域名博客。媒体称blogbus等为个人博客并不完全正确,因为“个人”这个词用在第三方平台上并不恰当,顶多算“博客服务”,就像公众号一样,称“个人公众号”也很奇怪。所以说,并不能称个人博客完蛋了,迟早有一天博客又会受到亲耐,至少在传播学意义上RSS还很有市场。就让那些公众号,微博,朋友圈儿都去吧,没事,我还是会常常在自己的博客写点东西。

12:37:12 已有0条回复
132018.8

其实很简单,substr按字,substring按位:

var str = '我很高兴ho~'
str.substring(str.length - 5, 5) // 高兴h
str.substr(str.length - 5, 5) // 高兴ho~

 

12:06:45 已有0条回复
122018.8

开源已经是软件领域占据绝对主导的一种策略。但是,很不幸,大部分人对开源的认知都无外乎两个点:“免费”“开箱即用”。所谓免费就是说你开源的软件,我不用买许可证,直接用,你的协议最好还是MIT,这样我用起来一点版权顾虑都没有。开源=免费,这几乎成为行业共知。而“开箱即用”则体现在使用者对开源软件的依赖性,它们希望一个开源软件可以按照自己的想法工作,如果不行的情况下,就去给软件作者提issue。实际上,在我看来,“免费软件”和“开源”完全是两个层面的事。开源的真正意义是,让原本封闭的独裁的技术公开,让其他开发者可以从中学习,在自己的产品里使用开源代码里面的思想、思路、甚至是实现方式,而非提供完整的产品免费给人用。但现在行业里面曲解开源精神,以github为主导的开源世界实际上是推崇“开源免费软件”这一完整的概念,而非“开源”概念本身,也就是说,一个开源项目的作者,被要求把这个项目做成一个完整的,其他开发者拿过去就开箱即用的,而且还要有完整文档的,甚至issue反馈即时的项目。这其实是做软件的思路,而非做开源的思路,开源变成了软件的一种分发方式,开源精神本身反而在这种潮流中被淡忘,甚至如果不按这种模式行事的开源项目,还会被数落。开发者不仅不感谢开源者将自己的思想公之于众,反而以形式化的要求去数落他,这样而言,他大可以不开源了,自己好好把项目做好,赚更多钱,而对于那些叫嚣开源项目完整性的人,多半不喜欢去看源码,而喜欢看文档,也就是那类拿来主义而已。

22:58:14 已有0条回复
102018.8

isObject

JS里面判断一个变量是否为object类型其实比较麻烦,除了array和null会干扰以外,我们知道,所有的衍生数据类型的本质都是object,要想知道一个数据是否是单纯的object,我们就要排除这些干扰,直接检测这个变量的constructor:

function isObject(value) {
  return value && typeof value === 'object' && value.constructor === Object
}
08:39:57 已有2条回复
  1. 运行了一下代码发现constrcutor单词拼写错误,改正constructor
    #588 gzwawj 2018-08-27 10:59 回复
  2. 已修正,谢谢指出
    #589 回复给#588 否子戈 2018-08-27 18:22 回复
082018.8

终于又重写完一个库,改名为databaxe,是一个前端数据请求管理相关的库,在datamanager.js的基础上修改而来,使用了indexedDB和webworker,是一个现代化的数据请求管理工具。它的理念什么的已经在相关文章里面介绍过了:

这次的改版(改名)是为了简化概念,重新提炼api,并且将同步转化为异步,将之前容易混淆的地方全部修改过,变成单一可理解的api。特别是对get方法进行改造,之前的get方法基于localStorage,是同步的,现在基于indexedDB,是异步的,与数据请求保持一致的行为操作模式,让使用起来更方便新手入门。同时开放了dispatch接口,时它拥有更新本地数据的能力。

要了解这个库移步DataBaxe

00:42:55 已有0条回复
112018.7

这几天真的是下了苦心,把之前的四个包完完整整的重写了一遍,并将作为自己今后开发的开箱必用包,它们分别是hello-events(事件绑定与触发管理),hello-storage(localStorage等本地化存储简化操作),hello-worker(webworker简便使用),hello-indexeddb(超简单indexeddb使用包),接下来打算把之前写的datamanaer.js重写一下,要用hello-什么做名字还没想好,但是肯定会是最完美的前端数据获取模式。完成这个之后,就是要把hst-virtual-dom再重写一遍,把之前写的toex用上,这样就可以让virtual dom这块完美收官了。

01:12:30 已有0条回复
092018.7

Blob和ArrayBuffer的区别