标签 源码 下的文章

折腾记:Hello Parcel

Parcel 是一个新出的「快速,零配置的 Web 应用程序打包器」,光是零配置这一点,看着就已经比 webpack 好一万倍了——webpack 让我们怀疑,前端是否要衍生出一种副职业:配置工程师。我至今也没有能够掌握「如何优雅的配置 Webpack」,之前本来准备用 poi来简化 webpack 配置,不过突然想起了这个更高、更快、更强、(更懒)的新道具,于是又折腾了起来。

Parcel 有啥优点

首先,他的优点是零配置,也就是说,你不用自己配置就能支持 JS / CSS / HTML,开箱即用。此外,零配置不代表不能配置,它提供了接口,可以让你进行一些插件的开发,在此基础上做出一些 DIY,零配置的意义其实是带默认值、开箱即用的配置,而并非不可配,灵活性差。

- 阅读剩余部分 -

Canvas 实现根据背景色更改前景色

最近有一个需求,大致是要根据图片的背景色来切换前景色,也就是根据 background-color 的色值切换 color。

虽然这么一说,那么就能抽象出以下几个问题:

  1. 如何取到图片某像素的 color 值,或者是某像素区域的平均 color 值
  2. 如何根据 color 划分、如何改变前景的(如 icon、font)color。

- 阅读剩余部分 -

Vue Server Side Render 的爱与恨

昨天整了一天的 SSR,卒,总结一些经验教训仅供参考。

为什么又双叒叕要用 Server Side Render

这就要说到天下合久必分,分久必合的道理了——最初的时候,静态页面就是静态页面,前后端 MVC,服务端渲染出页面;之后,前后端分离,后端提供 API,由客户端渲染页面;最后,我们又回到了最初的起点,不过是前后端分离后再由后端多渲染一次。

这样做的优点当然有很多啦,比如说我们要照顾爬虫(不),照顾蜘蛛,Vue 官方文档写的几点都已经很清楚了:

- 阅读剩余部分 -

Vue2.x 中实现父子组件间的双向绑定

Vue2.x 中父子组件中 props 的属性不能在子组件中改变其值然后传出至父组件了,但是有的时候也会存在一些麻烦,比如我们想要实现一些自定义组件,总是会有值的传入传出改变的,比如我希望做一个 popup,那么肯定需要根据父节点的状态来确定子节点。

尽管官方推荐双向数据流,但还是有一些方法避免报错,实现或 hack 双向数据流:

Event Bus / Vuex

最简单的当然是通过状态管理来管理我们的变量,但对于数据流不复杂的父子节点交互而言,未免太过浪费,因此通常我们不会特别的去考虑它,尤其是 popup / checkbox 这种基础组件的时候。

使用 Object

Object 的值是其内存地址,只改变 Object 内部的值不改变地址将不会出现报错。

- 阅读剩余部分 -

编译原理从零到一 写一个 JSON parser

最近在做 Chrome 插件的高级功能,突然想要试试可视化选择 key 的路径,再一想,咦,这不就是个编译原理的典型例题吗?

于是我就开始着手学编译原理了,主要参考 dalao 的以下两篇文章:

编译原理一共分为四个部分:词法分析,语法(文法)分析,语义分析,代码生成。

词法分析,就是逐个解析之后加上词性,语法分析则是将词法分析后的结果解析为抽象语法树,语义分析是在语法分析时针对具体的实例加上额外的动作解释。具体的可以见上面的链接。

JSON 的首页有非常完整的词法和语法分析的 token 列表甚至是流程图,所以可以省去了一些劳动。

- 阅读剩余部分 -

Hide Locked Problem In LeetCode Chrome插件 开发总结

在公司的黑客松放弃治疗之后,好久没有看我的 GitHub 了,于是更新了一下自己的其中一个万年大坑。

项目地址:https://github.com/csvwolf/hide-locked-problem-in-leetcode

这里推荐一下一个汉化版的开发手册:https://crxdoc-zh.appspot.com/extensions/

在上一版中简单的做了一个click触发的插件,不是我理想中的效果,于是研究了一下如何对页面加载做监听,甚至是监听指定的 DOM 载入。

- 阅读剩余部分 -

WangTrans 开发手记

WangTrans,汪星语翻译机开发其实已经一个多月了,也就是在半天里消极怠工写的东西,尽管依旧no star,不过发布在npm之后竟然也有莫名其妙的下载量,当晚就想总结一下学到的一些东西,但是由于每天回家都是——好累,不想动的循环,所以就拖到了现在。

想法的来源是因为单身狗每次都要手动输入汪汪汪+拼音,在虐狗节就非常的麻烦!说干就干……所以这是个非常标准的玩具。

第一段废话完:https://github.com/csvwolf/WangTrans

- 阅读剩余部分 -

Ubuntu/Python 结巴分词 + Word2Vec利用维基百科训练词向量

结巴分词是一个跨语言的中文分词器,整体效果还算不错,功能也够用,这里直接用Python了,其他主流语言版本均有提供。

Word2Vec,起源于谷歌的一个项目,在我刚开始接触的时候就关注到了他的神奇,大致是通过深度神经网络把词映射到N维空间,处理成向量之后我们终于可以在自然语言处理上方便的使用它进行一些后续处理。(具体的方法忘了)

Python的gensim库中有word2vec包,我们使用这个就可以了,接下来我们就对维基百科进行处理,作为训练集去训练。(包地址:http://radimrehurek.com/gensim/models/word2vec.html

本文参考:http://www.52nlp.cn/中英文维基百科语料上的word2vec实验

- 阅读剩余部分 -

Python 从多人聊天室开始谈系列 - Tkinter GUI

接下来我们差不多能聊起来了,剩下的就是解决上一篇中我们遗留的登出移除问题以及做一个界面,那样我们就能给更多的人用啦。

选择Tkinter,主要是,作为一个没有其他语言GUI基础的人,入门最简单粗暴的方法可能就是这个了。

关于Tkinter,网上的资源其实说不上太多,还是比较难找的,尤其是对于一个写惯了HTML/CSS的,其实是挺痛苦的。

Tkinter的布局教程可以看这里:http://effbot.org/tkinterbook/grid.htm

- 阅读剩余部分 -