博客

  • 通过awesome和alternative学技术

    编程技术学习到某个程度,就需要扩展眼界,这样才能把自己锻造成T字形人才,有深度有广度。

    我这里推荐两个方法可以扩展某个领域的知识面,一个是Awesome,一个是alternative。

    比如我想了解更多关于angular方方面面的知识,可以直接在github敲入awesome angular搜索,就可以找到这个repo https://github.com/PatrickJS/awesome-angular 如果感兴趣rust,就能找到https://github.com/rust-unofficial/awesome-rust 。Awesome类知识汇集有点类似百科全书,或者是以前的dmoz(还有人知道这个么?),有空就可以瞅瞅,对于某个项目/库感兴趣了就深挖一下。

    alternative的用法又不一样了。我经常收到领导的要求,其实也是架构师常见的工作,就是比较不同产品或者框架的优缺点,做一些比较或者雷达图什么的。这时候就可以搜索关键字加“alternative”,比如想了解aws的竞争者就在谷歌搜“aws alternative”,然后点开结果页面看看。还有一个网站https://alternativeto.net/ 就是专门做同类型软件比较打分的,还算客观。

  • 周末玩玩技术

    我很久以前玩过一段时间的google appengine,用它来连接rss填补google reader的空白。前两天趁着周末又捡出来把玩了一下,现在的感觉却不怎么好用了,难怪google的云计算赶了个大早,却被后来者azure居上。

    简单的crud应用,比如todo或者记事本甚至是proxy,appengine还是可以用一用的。但是它有几个问题,一个是standand环境的编程比较复杂,开发者要了解一大堆东西,总算把google datastore在nodejs上跑了起来,但是运行起来才发现javascript版本的rss parser不给力,不如python的feedparser成熟。而python想找一个在appengine稍微能用的blog或者cms几乎是不可能的,大多数的github项目都是11、12年甚至零几年的。另外的问题是如果不付费很多功能都阉割了,即使google cloud赠送了300美元一年的试用,可是我不想浪费时间在这个没落的平台上了。

    于是又想到了新型的平台zeitnetlify,它俩都支持连接到github直接拽代码部署,命令行直接搞定,试用了一下部署一个coreui的angular demo棒棒哒。如果是纯js项目可以考虑这两个平台。

    做toy project的开发者还可以考虑heroku,这个老牌平台虽然有着google cloud同样的缺点,但是它上面一些开源项目却很实用,比如部署了一个下载youtube视频的应用在上面,还可以支持v2,前面挂上cloudflare那就可以特殊情况下应应急。

  • Different methods in JavaScript to do deep clone for plain object without libraries

    1, use JSON.parse and JSON.stringify, but it has many issues, major one is can’t handle Date type.

    var cloned = JSON.parse(JSON.stringify(objectToClone));

    2, refer to this, mainly ideas is loop the properties one by one, and go into children, also need to handle ‘Function’, ‘Symbol’, ‘WeakSet’, etc. all possible data types in JavaScript :

    https://stackoverflow.com/questions/122102/what-is-the-most-efficient-way-to-deep-clone-an-object-in-javascript

    function clone(obj) {
        if (obj === null || typeof (obj) !== 'object' || 'isActiveClone' in obj)
            return obj;
    
        if (obj instanceof Date)
            var temp = new obj.constructor(); //or new Date(obj);
        else
            var temp = obj.constructor();
    
        for (var key in obj) {
            if (Object.prototype.hasOwnProperty.call(obj, key)) {
                obj['isActiveClone'] = null;
                temp[key] = clone(obj[key]);
                delete obj['isActiveClone'];
            }
        }
        return temp;
    }
    

    also there are more examples could refer to, for example this version needs ES6 supports https://stackoverflow.com/questions/40291987/javascript-deep-clone-object-with-circular-references

    function deepClone(obj, hash = new WeakMap()) {
        // Do not try to clone primitives or functions
        if (Object(obj) !== obj || obj instanceof Function) return obj;
        if (hash.has(obj)) return hash.get(obj); // Cyclic reference
        try { // Try to run constructor (without arguments, as we don't know them)
            var result = new obj.constructor();
        } catch(e) { // Constructor failed, create object without running the constructor
            result = Object.create(Object.getPrototypeOf(obj));
        }
        // Optional: support for some standard constructors (extend as desired)
        if (obj instanceof Map)
            Array.from(obj, ([key, val]) => result.set(deepClone(key, hash), 
                                                       deepClone(val, hash)) );
        else if (obj instanceof Set)
            Array.from(obj, (key) => result.add(deepClone(key, hash)) );
        // Register in hash    
        hash.set(obj, result);
        // Clone and assign enumerable own properties recursively
        return Object.assign(result, ...Object.keys(obj).map (
            key => ({ [key]: deepClone(obj[key], hash) }) ));
    }

    Anyway, I recommend to use JavaScript library ‘clone‘ for the deep clone, it could handle circular reference correctly.

    If you need to create more complex feature to re-create (serialization) new instance from source object or JSON string (and use TypeScript), I prefer to use this https://github.com/typestack/class-transformer The ‘class-transformer’ doesn’t force you to describe the class with decorator (of course you could do it, and have to if you need rich features), it is good point I prefer to.

  • vi 使用技巧

    显示回车换行

    :e ++ff=unix

    移动光标

    • 0 – 移动到行首
    • ^ – 移动到行首的非空白符
    • $ – 移动到行尾
    • h – 左移光标
    • j – 下移光标
    • k – 上移光标
    • l – 右移光标
    • Ctrl + b – 向后滚动一屏
    • Ctrl + f – 向前滚动一屏
    • Ctrl + d – 向前滚动半屏
    • Ctrl + u – 向后滚动半屏

    https://vim.rtorr.com/lang/zh_cn