JavaScript中实现国际化的方案有不少，从github上star数较多的选择角度，选择了i18Next库，生态比较全。

i18next的官方教程文档不够明了，记录一下入门使用，主要是加载自定义的多语言json文件。

拷贝官方的实例

1

https://github.com/i18next/jquery-i18next/blob/master/example/sample.html

将官方的实例放入Web服务器上，通过浏览器可直接访问。

此时的文字内容是通过js代码直接定义的，若是要添加其他的语言，直接在resources中添加即可。

增加对多语言json文件的支持

引入插件xhr backend

增加xhr配置项：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

{
  // path where resources get loaded from, or a function
  // returning a path:
  // function(lngs, namespaces) { return customPath; }
  // the returned path will interpolate lng, ns if provided like giving a static path
  loadPath: '/locales/{{lng}}/{{ns}}.json',

  // path to post missing resources
  addPath: 'locales/add/{{lng}}/{{ns}}',

  // your backend server supports multiloading
  // /locales/resources.json?lng=de+en&ns=ns1+ns2
  allowMultiLoading: false,

  // parse data after it has been fetched
  // in example use https://www.npmjs.com/package/json5
  // here it removes the letter a from the json (bad idea)
  parse: function(data) { return data.replace(/a/g, ''); },

  // allow cross domain requests
  crossDomain: false,

  // allow credentials on cross domain requests
  withCredentials: false,

  // define a custom xhr function
  // can be used to support XDomainRequest in IE 8 and 9
  ajax: function (url, options, callback, data) {}

  // adds parameters to resource URL. 'example.com' -> 'example.com?v=1.3.5'
  queryStringParams: { v: '1.3.5' }
}

使用xhr:

1
2
3
4
5
6

import i18next from 'i18next';
import XHR from 'i18next-xhr-backend';

i18next
  .use(XHR)
  .init(i18nextOptions);

增加json文件

增加json翻译文件：

1
2
3

locales/en/translation.json
locales/zh/translation.json
locales/dev/translation.json

切换语言

切换多语言，切换之后需要再调用localize函数。

1
2
3
4
5
6

var lan = i18next.language;
i18next.changeLanguage(lan == 'zh' ? "en" : "zh", (err, t) => {
    // resources have been loaded
    console.log("changeLanguage success: " + i18next.language);
    $('.translation').localize();
  });

缓存的问题

v1.4.1版本增加查询参数，可以控制浏览器的缓存。

使用方法：在配置项中增加以下的版本配置。

1

queryStringParams: { v: '1.3.5' }

【全文完】

–update 2017.5.14
增加v1.4.1版本的查询参数配置说明

技术类
[x] 《CSS实战手册》
[x] 《JavaScript DOM编程艺术》
[x] 《JavaScript高级程序设计》
[x] 《Vue权威指南》
[x] 《HTML & CSS: Design and Build Website》
[ ] 《HTML5实战手册》
[ ] 《HTTP权威指南》
[ ] 《Linux: 鸟哥的私房菜》
[ ] 《计算机的构造与解释》

人文历史类
林语堂系列
[x] 《说话的艺术》
[ ] 《京华烟云》
[x] 《武则天正传》
[x] 《老子的智慧》
[x] 《从异教徒到基督教》
[x] 《笑傲江湖》

经济类
[x] 《财务自由之路》-波多 舍费尔
[x] 《投资中最简单的事》

其他
[x] 《人生目标清单》
[x] 《一生的计划》
[x] 《一万小时天才理论》
[x] 《疯狂的站长》
[ ] 《网站致富》
[ ] 《编程人生》
[x] 《断舍离》
[x] 《怀孕圣经》
[x] 《爱的艺术》
[x] 《深度工作》
[x] 《The Power Of Less》

感悟：
今年一年读了不少书，有一部分是精读，有一部分是略读；读书的场所，前半年主要在
地铁上居多；读书的媒体，kindle居多，其次是纸质，再次为电脑。
相对于年初计划的书单，增加了几本和技术无关的书籍。

今年读过比较推荐的几本书：
1、《CSS实战手册》，讲了很多CSS的实战技巧，可以学到很多东西。
2、《JavaScript高级程序设计》，前端js基础，准备18年继续刷一遍前6章。
3、《老子的智慧》，浓缩了林语堂老先生对道教老庄思想的总结。
4、《从异教徒到基督教》，林语堂老先生对各个宗教信仰的对比。
5、《断舍离》、《深度工作》、《The Power Of Less》，主要讲工作效率和方法的。

不推荐的书：
1、《Vue权威指南》，水分比较多，内容主要来自于官网的文档。

【全文完】
2017.12.24更新

收集一些好用的BT站点，方便平时的学习和交流:)

• Mininova 网址 http://www.mininova.org/
  特点：东西比较多资格比较老，地球人都知道资格老的总能排第一位。
  种子数量较少。

• The Pirate Bay 网址 http://thepiratebay.org/
  特点：东西比较多而且有中文，找东西方便，可惜速度有点慢。（最近官司不断，希望海盗湾能坚持下去！）

• SumoTorrent 网址 http://www.sumotorrent.com/
  特点：速度比较快，可惜更新稍微慢一点。

• SeedPeer 网址 http://www.seedpeer.com/
  特点：分类比较清晰，种子比较一般。

• VeryCD共享 网址 http://www.verycd.com/
  特点：这虽然不是BT站点，不过考虑到Bitcomet现在已经可以支持电驴种子了，中国的P2P站点应该没有比它的资源更加丰富了吧，可惜驴子跑的太慢，不如叫电马好了，马应该跑得比驴快，呵呵。

• 圣城家园 网址 http://www.dream2008.cn/
  特点：游戏种子比较多，喜欢游戏的可以到这里下载。

后续有遇到好的站点，再更新。。。

【全文完】

开发过程中，修改js和css，希望浏览器能够加载最新的代码，需要清除缓存，记录几种Chrome下的方法。

Chrome下清除浏览器缓存刷新页面的方法

开发者工具中禁用缓存选项

打开Chrome的开发者工具，Network下有个Disable cache选项，勾上即可。

注意点： 该选项只有在开发者工具保持打开状态有效。

浏览器插件：Cache Killer

安装浏览器插件，可以打开或者关闭。

右键点击刷新按钮

右键点击刷新按钮，可出现三个选项：

• 正常重新加载
• 硬性重新加载
• 清除缓存并重新加载

可选择“清除缓存并重新加载”，来清除全部缓存。

【全文完】

wordpress 4.7 中文版本中的gravatar头像已经由国外的转换为多说的头像，不过多说的头像仍然无法访问，导致页面加载速度变慢。

处理方法：

在functions.php文件中删除原来的获取多说头像的函数，并增加以下代码即可：

1
2
3
4
5

function get_avatar_deadwood( $avatar ) {
    $avatar = preg_replace( "/http:\/\/(www|\d).gravatar.com/","https://secure.gravatar.com",$avatar );
    return $avatar;
}
add_filter( 'get_avatar', 'get_avatar_deadwood' );

原理仍然是通过替换获取头像的链接，只是修改为gravatar的https链接。修改后的访问速度还不错。

【全文完】

关于模态窗口的数据如何回传到主控制器中？

通过$uibModalInstance.close(data)来回传数据。
主控制器通过result回调接收即可。

代码实例如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

app.controller("commonCtl", function ($scope, $uibModal) {
  $scope.openDialog = function () {
    var modalInstance = $uibModal.open({
      templateUrl: 'dialog.html',
      controller: 'formCtl',
      windowClass: 'window',
      size: 'lg',
      resolve: {
        data: function () {
          return $scope.data;
        }
      }
    });

    modalInstance.result.then(
      function (data) { // 关闭时回传过来的值（$uibModalInstance.close(data)）
        $scope.data = data;
      },
      function (reason) { // 取消时
        // 点击空白区域：backdrop click
        // 点击取消：cancel
      }
    );
  };
})

【全文完】

在Web的早期，页面是有两个版本： 一个是为Netscape Navigator而写，另一个是为微软IE。

当W3C制定Web标准时，浏览器并不能立即开始使用它们，因为这样做会破坏许多已经存在的网站。因此浏览器引入了两个模式来对待新标准兼容的站点和遗留下来旧的站点。

目前在浏览器上有三种用于布局引擎的模式：怪异模式(quirks mode)、近标准模式(almost stardards mode)和完全标准模式(full standards mode)。

在怪异模式下，布局模拟Navigator 4和IE5的非标准行为。

这对于支持在Web标准被广泛接受之前创建的站点是必须的。在完全标准模式中，行为是按照HTML和CSS规范中描述的。在近标准模式中，只有一小部分的怪异实现。

数据可视化中的几个基础概念解释。

维度

数据分析过程中经常使用的一个概念，分析数据的角度。主要是指数值、时间和文本。

图表类型

• 散点图

展示数据的分布

• 折线图

展示某一维度数据在时间上的规律或者趋势

• 柱形图

展示多个维度的比较和变化

• 饼图

展示一组数据的占比情况

Mac远程控制其他Mac

Mac下远程控制其他Mac的方法记录：

方法一：VNC

在被控制的Mac下打开系统偏好设置-共享-远程管理,打开远程管理，另外一台Mac通过vnc连接。

另外一台Mac打开Finder, 输入CMD+K，打开连接服务器的界面，输入vnc://IP进行连接，连接成功
即可远程控制。

方法二：iMessage

未测试成功

方法三：Apple Remote Desktop

未测试

参考

Mac OS X 上有什么好的远程桌面操控软件吗？

【全文完】

记录AngularJS在生产环境下的一些配置，针对性能上的优化有帮助。

关闭调试数据

AngularJS默认会添加一些关于绑定、作用域到DOM节点，以及添加CSS类到数据绑定的元素。这些
信息主要是用于一些类似Protractor和
Batarang的工具使用。

生产环境下可关闭这些调试数据，以优化项目的性能，配置方法如下：

1
2
3

myApp.config(['$compileProvider', function ($compileProvider) {
  $compileProvider.debugInfoEnabled(false);
}]);

如果有需要调试，可以再浏览器的控制台中运行以下语句来打开：

1

angular.reloadWithDebugInfo();

关闭控制台的debug信息

一般我们会在代码中使用$log.debug()来添加控制台的调试信息，方便调试。一旦项目在生产环境下，这些
信息就不需要留给最终用户，因此可以选择关闭。

1
2
3

myApp.config(['$logProvider', function ($logProvider) {
  $$logProvider.debugEnabled(false);
}]);

说明：

该配置只是关闭debug级别的信息，debug以上的级别还是会在控制台输出，包括info,warn,error这些。

【全文完】