如何在自己的网页中添加ga分析

在学习前端的过程中，自己都想统计用户的访问量，下面代码可以做到最轻量级的追踪：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
/*<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-X']);
  _gaq.push(['_trackPageview']);
  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
*/

具体可以参考如下
https://developers.google.com/analytics/devguides/collection/gajs/

wkwebview同步获取返回结果

今天在测试UIWebView和WKWebView的时候，发现如下区别

  1. UIWebView执行stringByEvaluatingJavaScriptFromString方法，因为直接返回结果，所以是同步的。
    WKWebView执行evaluateJavaScript：completionHandler是在block中获取执行结果的，所以他是异步进行的，
    这样在进行性能测试的时候，发现如果不将WKWebView他修改为同步，是无法进行对比的，然后自己就通过如下方法

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
       - (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)javascript {
        __block NSString *res = nil;
        __block BOOL finish = NO;
        
        [self.webView evaluateJavaScript:javascript completionHandler:^(NSString *result, NSError *error){
            res = result;
            finish = YES;
        }];
        
        while(!finish) {
            [[NSRunLoop currentRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate distantFuture]];
        }
        return res;
    }

    将WKWebView修改为同步状态，然后进行对比，主要是测试JavaScript函数执行100，300，500，1000，3000次，统计时间，可以发现在相同JS功能情况下，WKWebView的效率还没有UIWebView的效率高，如下图
    可以看出，JavascriptCore的效率是最高的，而WKWebView改成同步以后，实际效果是最差的，分析原因也可能是因为，WKWebView不是这样用的，毕竟在无限等待中，所以结果也可能是受影响的。

    http://www.jianshu.com/p/3a59107aa2d2
    http://stackoverflow.com/questions/26778955/wkwebview-evaluate-javascript-return-value

react native 新语法

最新的RN，已经全部转移到ES6，所以很多之前老的写法，会报错，比如
在react-native中引用React的做法发生了变更（在当前版本老的做法会报错）：

之前

import React, { Component, View } from 'react-native';

现在

import React, { Component } from 'react';
import { View } from 'react-native';

具体有很多，可以参考这篇文章 科学上网。

具体就是：

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
33
34
35
36
37
38
39
n React 0.14 for Web we started splitting up the React package into two packages `react` and `react-dom`. Now I'd like to make this consistent in React Native. The new package structure would be...
"react":
Children
Component
PropTypes
createElement
cloneElement
isValidElement
createClass
createFactory
createMixin
"react-native":
hasReactNativeInitialized
findNodeHandle
render
unmountComponentAtNode
unmountComponentAtNodeAndRemoveContainer
unstable_batchedUpdates
View
Text
ListView
...
and all the other native components.
So for a lot of components you actually have to import both packages.
var React = require('react');
var { View } = require('react-native');
var Foo = React.createClass({
render() { return <View />; }
});
However, for components that doesn't know anything about their rendering environment just need the `react` package as a dependency.
Currently a lot of these are accessible from both packages but we'd start issuing warnings if you use the wrong one.
This would be a little spammy so ideally we would have a simple codemod script that you can run on your imports to clean them up.
E.g. something that translates existing patterns like:
var React = require('react-native');
var { View } = React;
into:
var React = require('react');
var { View } = require('react-native');
If anyone wants to write and share that script with the community, that would be highly appreciated. We can start promoting it right now before we deprecate it.

批量生成二维码

本文主要是在工作的时候，需要做一个批量生成二维码的功能，通过超找网上资料，简单实现了一个demo，具体可以参考批量生成二维码

#####使用说明
主要是依赖qrcode，具体参考https://pypi.python.org/pypi/qrcode/5.1，qrcode又依赖Pillow。

目前比较简单，就是针对输入的input目录，将二维码生成到output目录中。

#####安装

  1. pip install Pillow
  2. pip install qrcode
  3. python ./ant_qrcode.py

如果安装出现权限的问题，可以通过暴力添加sudo pip ….执行。

正则表达式的学习

本文主要记录了自己在工作中用到的部分正则表达式的零星点碎的内容。

  1. \\.，\\| 等\\操作。 \\|这是转义的意思 “\” “|” 都是特殊字符所以需要转义，第二个反斜杠 \ 转义 |

  2. 前瞻后顾 学习 !?操作

  3. 贪婪与非贪婪 ? 当正则表达式中包含能接受重复的限定符时，通常的行为是（在使整个表达式能得到匹配的前提下）匹配尽可能多的字符。以这个表达式为例a.*b，它将会匹配最长的以a开始，以b结束的字符串。如果用它来搜索aabab的话，它会匹配整个字符串aabab。这被称为贪婪匹配。 有时，我们更需要懒惰匹配，也就是匹配尽可能少的字符。前面给出的限定符都可以被转化为懒惰匹配模式，只要在它后面加上一个问号?。这样.*?就意味着匹配任意数量的重复，但是在能使整个匹配成功的前提下使用最少的重复。现在看看懒惰版的例子吧：
    a.*?b匹配最短的，以a开始，以b结束的字符串。如果把它应用于aabab的话，它会匹配aab（第一到第三个字符）和ab（第四到第五个字符）。

1
2
3
4
5
6
7
\d+：匹配数字一次或者多次
\d.*：先匹配一位数字，剩下匹配任意字符零次或者多次
\d.*?：*?这个表示非贪婪模式，表示匹配最少的数量匹配
例子：<DIV>123<DIV>456<DIV>
贪婪：<DIV>.*<DIV> ====> <DIV>123<DIV>456<DIV>
非贪婪：<DIV>.*?<DIV>====> <DIV>123<DIV>

在我们闪惠的输入限制里面，有如下的正则： 

1
2
3
4
5
6
7
NSString *regex = @"^(?!0[^\\.])\\d+\\.?\\d{0,2}$";
解析下来就是如下，比使用代码一个一个判断条件过滤要好太多了。
	 /**
     *  (?!0[^\.])  第一个数字为0的时，后面只能输入小数点
     *  \d+\.?      小数点前（若有）只能为数字
     *  \d{0,2}     小数点后最多输入两位数字
     **/
  1. 范围 / rex /gmi g–global, m–multiline, i–ignore
  2. 常用的元字符
代码 说明
. 匹配除换行符以外的任意字符
\w 匹配字母或数字或下划线或汉字
\s 匹配任意的空白符,空格，tab，换行，中文全角空格等
\d 匹配数字
\b 匹配单词的开始或结束
^ 匹配字符串的开始
$ 匹配字符串的结束

常用的限定符

代码 语法 说明
* 重复零次或更多次
+ 重复一次或更多次
? 重复零次或一次
{n} 重复n次
{n,} 重复n次或更多次
{n,m} 重复n到m次
  1. []里面的不要转义，比如 [aeiou]匹配每一个元音，[.*?]匹配标点符号(.?!)