使用逼近算法生成韦恩图的探究与经验

维恩图(venn),也叫文氏图,用于显示元素集合重叠区域的图示。我们准备在echarts中提供这类图表。第一期支持两个集合的韦恩图,后期准备支持三个集合乃至多个集合的韦恩图

准备

使用zrender框架,画出两个circle使之重叠,即可产生一个韦恩图。但是,互相重叠的部分会相互遮挡,(如下图)解决方案是对每个circle都调整透明度至50%。

venn 透明度

venn 透明度

阅读全部

可伸缩的同构Javascript代码

原文:http://blog.nodejitsu.com/scaling-isomorphic-javascript-code/

译者注:这是一篇2011年的老文了,最近苦恼于单页面应用的首屏速度与SEO问题,期望本文能给有同样烦恼的同学们带来些启示。

先花点时间想想你是有多么频繁地听到“Model-View-Controller”(MVC)这词儿,但你真正明白它的意义吗?在较高层次上而言,它是指在一个基于图像系统(非光栅化图像,比如游戏)以展示为主的应用中对功能的关注点分离(separation of concerns)。进一步看,它就是一堆表示不同事物的专有名词。过去,许多开发者社区都创造了各自的MVC解决方案,它们都能很好地应对流行的案例,并且在一步一步地发展。最好的例子就是Ruby和Python社区以及它们基于MVC架构的Rails与Django框架。

MVC模式已经被其它语言所接受,比如Java,Ruby和Python。但是对于Node.js而言还不够好,其中的一个原因就是:Javascript现在是一个同构的语言了同构的意义就在于任何一段代码(当然有些特殊代码例外)都能同时跑在客户端与服务器端。从表面上讲,这个看似无害的特性带来了一系列当前的MVC模式无法解决的挑战。在这篇文章中我们会探寻目前存在一些的模式,看看它们都是怎样实现的,同时关注不同的语言及环境。另外也谈谈它们为什么对于真正同构的Javascript而言还不够好。在最后,我们会了解一种全新的模式:Resource-View-Presenter

阅读全部

Windows平台开发必备工具

每个开发者都有自己喜爱的应用工具,本文分门别类为大家介绍几个陪伴多年的依依不舍软件。希望大家喜欢。如果你有更好的,也请发邮件告诉我。

文本编辑器

Notepad++(★★★★)

Windows下Notepad每个人都知道,这里要说的是NOTEPAD++,经过多次升级之后性能和稳定性都非常不错。作为开源编辑器中的老资格,功能简单,插件丰富。个人非常喜欢Notepad++。

Notepad++

Notepad++

Sublime Text(★★★★)

Sublime Tex好像是近些年来的后起之秀。很多忠实的粉丝用户这个跨平台的GUI编辑器。功能很多,插件也很丰富。唯一不爽的就是需要购买之后才能拜托那个保存时候跳出来的提醒。 Sublime Text

阅读全部

一种雪碧图自动化方案的设想

制作“雪碧图”一般是前端优化的重要一步,主要作用当然就是减少HTTP请求数。但是由于传统方法的雪碧图制作和维护成本都极高,加之现代浏览器支持的并发数也不断提高,所以很多人开始质疑做这项工作的必要性。但并发支持度变高,并不代表无限支持,网页首屏需要加载十几张图片资源还是很常见,再算上js、css以及一些数据的ajax请求,HTTP数上五十也是轻轻松,于是,用户体验就不那么好了。所以,这个工作不能省,但是开发成本又不得不考虑,于是,“雪碧图自动化”是自然而然就会产生的想法。

先看下雪碧图的发展历史:

阅读全部

玩转AMD - Loader

不用 RequireJS 的理由

理由很简单,因为太大了。RequireJS 经过语法压缩和 GZip 后,体积超过了 6k。RequireJS 最新版本已经降到了 6.1k,在 2012 年底时候的版本是接近 7k。由于下面的一些期望,让我们觉得这个体积比较大:

  • 在移动环境上应用
  • 在 baidu 搜索页面上用

既然这个体积比较大,那多少合适呢。当时我们拍了脑袋,一个 Loader,各种流转与依赖处理,两种 require,URL 查询,再加上异步的插件机制,就算看起来比较复杂,GZip 后 3k 应该没问题。开发时间我们规划了一个月,主要还是为编写测试用例留出一些时间。

后来…后来,事情远远超出了想象。我们开发了 AMD Loader: ESL,包括前前后后的一些改进和 new feature,开发过程持续了一年半多。现在虽然是一个特性稳定版本,但是仍未结束,可预见的未来还有 shim 的支持需要添加。至于体积,我们也没控制住,在每个我们觉得无法或缺的 feature 中,它的体积最终是 3.4k。如果你觉得所有的错误信息你都不需要,那么可以选择 min 版本,体积是 3.1k,超过最初的梦想并不太多。可见男人的承诺多半不靠谱。

阅读全部

玩转AMD - 应用实践

设计思路 篇中,已经对 AMD 在设计上的一些考虑做了比较详细的论述。所以这一篇只会提一些建议,引用一些 设计思路 篇中的结论,不会再详细描述为什么。

本篇提出的所有建议,都是针对于开发时就使用 AMD 的玩法。据我所知,有一些团队在开发时按照 CommonJS 的方式编写模块,通过开发时工具监听文件变化实时编译,上线前通过工具构建,AMD 纯粹被当作模块包装来用。本篇提出的建议不涵盖这种应用场景。

部分建议有一定的重叠,或者理由是相同的。举一反三能力较强的阅读者可能会觉得我很罗嗦,见谅。

阅读全部