中午看了一下分享的wx消息架构设计文章,深有感触,但由于内容比较XX,不能分享,这里写一些简单总结
1、为了规避消息的ack,server只通知client 有消息了,client自己拉取消息。
2、client拉取消息带上当前最大自己最大id,防止消息丢失。这个设计的很好
3、client运行时通知策略和类apns通知策略的不同方式
4、优化的通知带内容体的方式,需要ack
      真是两篇好文,可是…,我只能默默的享受了。接下来遇到个问题,如果用户有10w,每个server只有2w的连接,那这10w是怎么安排哪些用户连接哪个server呢。中午问了richard,说根据dns,那分析如下
      dns不是一个好方法,通过dns获取域名的ip列表,轮询ip地址连接。这个有个问题,如果某一个ip机器挂掉了,需要剔除某ip需要修改dns,而dns生效很慢。且这种方式不能对server做权重控制。
      一开始自己意淫的方式,向某server发起连接获取一个相对性能较好的ip及端口,再向该ip发起连接请求,但这种方式需要两次连接,后来问了一个运维朋友,发了一篇文章: LVS负载均衡原理和算法详解 可以利用DR/TUN方式来实现,但具体在client上还不清楚有什么样的解决方案。

19 / 09 / 2014 buling

      发现wordpress慢是一个很大的问题,特开一博来总结优化的相关方法,介于我也是在优化中更新的,此文会长期更新。
一、优化博客中插件加载的js位置。
      很多插件在header中注册了js脚本,但希望脚本放在footer部分加载,如果修改插件可能会影响插件的升级,下面的方法来自于stackoverflow : How to put my javascript in the footer
【方法】把下面的代码添加到 主题中的functions.php中

remove_action('wp_head', 'wp_print_scripts');
remove_action('wp_head', 'wp_print_head_scripts', 9);
remove_action('wp_head', 'wp_enqueue_scripts', 1);
add_action('wp_footer', 'wp_print_scripts', 5);
add_action('wp_footer', 'wp_enqueue_scripts', 5);
add_action('wp_footer', 'wp_print_head_scripts', 5);

N、其它技巧
1、博客中投放了百度广告,延迟异步加载的方法:现在header中加一个全局变量

var onLoadCalls = [];

再在小工具中或其它部分

onLoadCalls.push(function(){
    loadScript("http://cpro.baidu.com/cpro/ui/c.js",function(){
         BAIDU_CLB_DUP2_fillSlotAsync('u432452', 'sidebar-ad'); //sidebar-ad为广告展示的div#id
    });
});

接下来在尾部的js代码中添加如下代码

function loadScript(src, callback){
    var doc = document,
        body = doc.body,
        //创建一个新script来加载
        script = doc.createElement('script');
    script.type = 'text/javascript';
    script.src = src;
    script.onerror = script.onload = script.onreadystatechange = function(e){
        e = e || window.event;
        if(!script.readyState || /loaded|complete/.test(script.readyState) || e === 'error'){
            callback(src);
            script.onerror = script.onload = script.onreadystatechange = null;
        }
    };
    body.appendChild(script);
}
$(document).ready(function(){
    if(onLoadCalls && onLoadCalls.length){
        $.each(onLoadCalls, function(index, fn){
            fn.call(null, $);
        });
    }
});

上次有人说博客好丑,我仔细看了看,确实挺丑的/撇嘴。这一年来发现审美也有提高,很喜欢极简风格的事物,可是创造对我来说难度还是挺大,昨天中午搜了一下wordpress主题,知乎有:有哪些好看的极简的 WordPress 主题?,顶楼提供了自己博客,我看了一下,确实很漂亮,之前apple官网也用了类似线条来描述,但楼上不开源,唉,这….。
还好我们有微创新,其作用在于把别人好的东西抄过来发扬光大,这不,现在的主题(buling,姑且叫这个名字)出来了,这个主题是基于 chitose 更改过来的,基本没有原主题的特点了。
主题对不同屏做了适配,主要针对 大显示器/pad/手机浏览三种
目前主题设置包括如下几项:
1、影藏右边栏。隐藏掉也挺好看的
2、文章列表支持只显示N字长的摘要
3、页脚统计代码或备案信息等。
看到的表象就这么多了,主题由于是花昨天下班时间和今天中午午休时间赶出来的,所以肯定还有很多BUG,比如兼容性,我看了一下IE7还算正常,IE6就算了,我就不打算去支持了。so…现在还没有正式的主题供大家下载使用。
——————————–技术分割线—————————————
这也是第一次去学习wordpress主题开发,其中也涉及到很多api的使用,已经主题的一些设置配置信息,比如这篇文章:zh-cn:主题开发 这网站文章还是很不错,但访问速度实在是难受极了。
一、设置主题信息
在style.css中头部添加如下信息

/*
Theme Name: buling
Theme URI: http://www.mjix.com/archives/1417.html
Author: buling
Author URI: http://mjix.com
Description: 从chitose主题更改,铃不铃极简风格!
Version: 1.0
*/

二、设置主题预览图
截图screenshot.png放在主题根目录
三、设置主题相关信息
主题设置代码直接写在functions.php

//设置主题相关信息
update_option('buling_key', $_POST[$opt]);
//获取主题相关设置
get_option('buling_key');
//注册侧边栏信息
register_sidebar(array(
    'name' => 'Topbar',
    'before_title' => '

', 'after_title' => '

' )); //include sidebar.php文件 get_template_part('sidebar'); //echo,第二个参数可以启用多语言支持 _e('some msg!'); //return some msg __('some msg');

还有一堆the_xxx的api就不一一列举了,基本来说开发一套主题还是比较简单的,第一次可以拿一个现有主题来修改,很快就熟悉了。

16 / 09 / 2014 buling

      隔三差五就会这样,我到底要做点什么呢? 急需寻求一位设计朋友,有想法的设计朋友。
我想:
1、做一个视频下载网站/软件下载,当然只能放国外了,赚点广告费就行了
2、最近喜欢上旅游,希望做一个类似蝉游记类网站,但要更有展示创意,更有用户活跃度的社区
3、深圳实时公交 公众号已经突破1300人了,但一直还没有时间重构,设计师在哪里
4、做点智能硬件产品,现在很多硬件产品都在 gps/重力感应/陀螺仪等去做手环类产品,那不是我想要的
5、做一些线下事情,虽然线上才是强项,但总觉得很虚,开个什么店;5金/手机电脑科技产品/精品茶点小吃类。
这种想法跟大姨妈似的没事就折腾一下,很是痛苦,不知道什么时候才能挣扎出来。
技术不是全部,运用到产品才是根本
【后记】
      这些年,陆陆续续折腾了不少不成型的产品,但最终都是不了了之,一个人的精力总是有限的,专业的人做专业的事情太有必要了。
最近也有两个朋友让过去做一些事情,也是犹豫不绝,不知何去何从

      有时候在ipad或者android等移动设备上需要查看网页源代码,但移动设备本身是不支持查看,只能通过代码方式,之前一直用国外一款工具(忘了名字),但感觉有点慢,所以就根据geshi提供的api,自己搭建了一个,访问地址:http://www.mjix.com/code/viewsource/
      有时候看一些电影下载网站,页面看不到下载链接,只能通过查看源代码的方式获取链接地址,在ipad上很是不方便,通过这个工具查看源代码就方便很多。
怎么安装呢?
方法一:通过电脑收藏夹同步到IPAD等设备。拖动下面的链接到你的收藏夹中:
View Source
方法二:直接添加到收藏夹
1、添加当前页面到你的收藏夹中
2、点击  这个文件查看收藏夹代码  并且复制代码
3、修改刚刚添加到收藏夹中的“查看源代码”,粘贴代码到URL中,保存。

提供api为:http://www.mjix.com/code/viewsource/?uri=$url

      之前一直想做一个文字粒子效果的淡出淡进,这两天事情不多就写了一下代码,效果地址:http://www.mjix.com/code/canvas-text/,按F11进入全屏,做屏保还可以,预览图

======================已更新==========================
      由于之前版本,像素点是通过fillRect来实现,性能有严重问题,会卡顿,cpu直接能飙到25左右,新版通过生成imagedata,再putImageData来达到更新效果。
      主要是在粒子(文字像素点)的位移问题上的处理方法。淡进前需要先获取到像素点的初始位置极其透明度,这个东东运用到数学左边换算问题,要遇到数学有点头大就跳过吧

     //获取渐进前的像素点位置
    getInData : function(data, min, offset){
        var xs = [],
            ys = [];
        this.each(data, function(info, index){
            xs.push(info[0]);
            ys.push(info[1]);
        });
        var max = Math.max.apply(xs, xs),
            mix = Math.min.apply(xs, xs),
            may = Math.max.apply(ys, ys),
            miy = Math.min.apply(ys, ys),
            //找出近似中间点
            midx = (max+mix) / 2,
            midy = (may+miy) / 2;
        var self = this,
            dis  = 0,
            len = 0,
            prop = 0,
            newData = [];
        this.each(data, function(info, index){
            alp = -self.random(0.1, 1);
            len = min+self.random(offset);
            dis = Math.sqrt(self.getDistance(info, [midx, midy]));
            prop = len/(dis+len);
            newData.push([]);
            var xy = Math.ceil((info[0]-prop*midx)/(1-prop));
            newData[index][0] = xy;
            xy = Math.ceil((info[1]-prop*midy)/(1-prop));
            newData[index][1] = xy;
            newData[index][2] = info[2].concat();
            newData[index][2][3] = alp;
        });
        return newData;
    },

      然后是更新像素点位置,方法是,随机一个前进长度,根据当前点和目标点及移动不长确定下一个移动目标点的位置,如下

    //获取指定长度点目标点位置
    getDestDot : function(data1, data2, length){
        if(data2[1]==data1[1] && data2[0]==data1[0]){
            return data2;
        }
        var xdis = Math.sqrt(this.getDistance(data1, data2)),
            prop = length/xdis;
        x = Math.ceil(prop*(data2[0]-data1[0])) + data1[0];
        y = Math.ceil(prop*(data2[1]-data1[1])) + data1[1];
        return [x, y];
    },

      直到所有的像素全部归位后,设置延迟,再淡出,淡出我就草草处理了,意思意思,效果自己看,源码就不说了。如所有的代码一样可能存在各种兼容性,BUG等等不可预料问题,留言反馈。
      之前1.0版本性能有严重问题,作为反例提供给大家:http://www.mjix.com/code/canvas-text/index1.0.html