GitLab Commands

After create a new repository on gitlab, it usually gives below command line instructions.

Git global setup
git config --global user.name "Jim Zhao"
git config --global user.email "jim@example.com"

Create a new repository
git clone https://gitlab.com/jimzhao/test.git
cd test
touch README.md
git add README.md
git commit -m "add file"
git push -u origin master

Existing folder
cd existing_folder
git init
git remote add origin https://gitlab.com/jimzhao/test.git
git commit -m "init message"
git push -u origin master

Existing Git repository
cd existing_repo
git remote rename origin old-origin
git remote add origin https://gitlab.com/jimzhao/test.git
git push -u origin --all
git push -u origin --tags

How to check changes on remote origin git repository?

There are couple of ways and lots of discussion regarding check changes on remote git repository.

git remote update - bring your remote refs up to date
git status - tell you whether the branch you are tracking is ahead, behind or has diverged

git show-branch *master - show commits in all of the branches whose names end in master (eg master and origin/master)

git pull origin master - bring my local up to date

git fetch origin - update the remote branch in your repository to point to the latest version
git diff origin/master - diff local against the remote
git merge origin/master - accept the remote changes

git remote show origin - Show synthetic view of what's going on remote "origin" repository

Git 101

git add - Add file contents to the index.
git branch - List, create, or delete branches
git bisect - Find by binary search the change that introduced a bug
git checkout - Checkout a branch or paths to the working tree
git clone - Clone a repository into a new directory
git commit - save staged changes to local repository
git diff - Show changes between commits, commit and working tree, etc
git fetch - download objects and refs from another repository
git grep - Print lines matching a pattern
git init - reate an empty Git repository or reinitialize an existing one
git log - show commit logs
git merge - Join two or more development histories together
git mv - Move or rename a file, a directory, or a symlink
git pull - Fetch from and merge with another repository or a local branch
git push - Update remote refs along with associated objects
git rebase - Rebasing is the rewinding of existing commits on a branch with the intent of moving the branch start point forward, then replaying the rewound commits.
git reset - Reset current HEAD to the specified state
git rm - Remove files from the working tree and from the index
git show - Show various types of objects
git status - Show the working tree status
git tag - create tagging.

git help xxx - to show help info

Yarn 101

Yarn is a new package management tool from Facebook, it is designed to solve daily development issues using NPM client. There are lots of posts to explain the advantages of Yarn. And the beauty of this tool is: Yarn is compatible with NPM and bower.

Here are some frequent commands for Yarn usage:

yarn init

yarn add [package]
yarn add [package]@[version]
yarn add [package]@[tag]

yarn upgrade [package]
yarn upgrade [package]@[version]
yarn upgrade [package]@[tag]

yarn remove [package]

yarn install

Installing all dependencies: yarn or yarn install
Installing one and only one version of a package: yarn install --flat
Forcing a re-download of all packages: yarn install --force
Installing only production dependencies: yarn install --production

Yarn reads package.json, generate yarn.lock file. These two key files are expected to check into version control system to share across team, so that each team member will get the same dependency list and install the same packages on different machines.

Developer can use npm and yarn at the same time, but we strongly recommend to use yarn to manage the packages due to the pitfalls from npm. The commands are easy to remember too.

yarn add -> npm install -save
yarn upgrade -> npm update (up, upgrade)
yarn remove -> npm uninstall
yarn install -> npm install

Black friday with Costco Tire Service Center

I plan to change battery for my mini van, so I turn to Costco. But I'd like to call their Tire Service Center before heading to the physical store. You know what, the experience greatly reduced my best shopping impression with Costco. Here is my experience:

I first call Almaden Costco, which took me 8 minutes wait to get someone talked to me. (There is standard Costco waiting recording audio) I asked them if you have the battery for my car model, the answer is "we should have". Then I asked them to double check, they guy went to check the system for in stock info.

I then call Sunnyval Costco, the call was answered without any voice, but put aside. On the other side, the employees are talking, laughing about birthday, camera, dinner etc. I understand this is holiday, but can you please also consider your customer's time? And at least, put to the system automated voice instead of your chatting/joking?

I am getting curios if all Costco service centers are doing the same thing, I selected another San Jose Costco to make the same inquiry. Well, the guy answered me with "Please hold on", then switched to automated recording audio. Exactly same as the Almaden Costco, I am putting to long waiting experience. This time, the waiting time exceeded 14 minutes to get my questions answered.

Costco, are you still feeling the competition from Amazon? Why not put customer (members) as the first priority when do business? I once expect Target or Costco can complete with Amazon, but the thought is getting the other direction. I have to admit Amazon is flying day and day, and it will beat every retail or wholesale stores after Amazon improve their return policy with local Whole Foods stores.

To sum up, Costco online and phone services are bad. The only strength they have are physical store experience with best return policy.

湾区财务讲座

因为想买保险，大大小小的理财讲座听了不少，网上也研究了一些。这周末的PFA讲座后，我以后再也不想听所谓的免费理财讲座了。

美国的保险公司很多，个人是不能直接购买的，一定要通过一个broker or agent来购买，所以层出不穷的理财顾问公司，电台媒体上也铺天盖地。不要给各种奖项闷到，感觉是个agent都可以获得，比如百万圆桌会员(Million Dollar Round Table)。有一点好像是共识，就是美国的保险费用相比大陆和香港是最便宜的，而且市场上最流行的IUL也是美国这边才有的。保险的终极目标就是能够化解die too soon, or live too long的问题。但保险每年都有cost of insurance等各种费用，如果市场连续不好，及时保本的IUL也会lapse。 另外就是保险的surrender fee在前10年很高，所以感觉IUL更是为了live too long的问题来设计的。

个人感觉眼花缭乱的信息中，无非就是3种：一些基金性质的理财产品， 保险(IUL, whole life, Term)，年金。有一个很好的个人博客，我强力推荐给初次接触保险的人，这样的保险经纪人才可靠。http://www.taolifeagent.com/chinese/

下面我就逐个的点评下我的经历，顺序不论先后：

萬富理财 Masterlife Financial Group
感觉比较正规的一个公司，讲产品算讲的蛮彻底的，而且听说我的年纪后，就不尽力推销我Allianz 222的年金。就听过一次，关于倒算指数法，也是IUL产品。因为在San Jose North, 所以我也没有预约做illustration.

理财公司2 （省去公司名，毕竟是我们华人的公司）
有个博士的头衔的人讲的思路比较清晰，但整个过程太夸张了，感觉都是为了最后的收费咨询。免费的讲座，收费的咨询，赶紧闪。要知道客户买了保险后，保险公司会给Agent一笔不小的佣金。

理财公司3（省去公司名，毕竟是我们华人的公司）
讲座主题比较丰富，涵盖面比较广，特别适用，但都是比较high level。做了一个计划，直接让买200万的夫妻双方共同的保险，10年付清，立马就觉得不厚道。共同保险费用低些，因为2个人都死了才可以拿到DB, 而且DB越高Agent的佣金越多。

佳音理财
讲的产品比较多，不全是保险，更倾向于理财。我没有什么现金，所以略过。

WFG
这家主要卖Transamerica的IUL, 但他们更多的是培训发展下线吧，需要交$100会员费。

PFA
跟WFG类似，免费讲座也没有听出什么名堂来，还要交$125会员费。

Invalid name: "@angular/cli" when do npm install

$sudo npm install -g @angular/cli

But I got the following error

npm ERR! Darwin 16.7.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install" "-g" "@angular/cli"
npm ERR! node v6.6.0
npm ERR! npm  v3.10.3

npm ERR! Invalid name: "@angular/cli"
npm ERR!
npm ERR! If you need help, you may report this error at:
npm ERR!     <https://github.com/npm/npm/issues>

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/jimz/Downloads/moxtra-admin/npm-debug.log

Somehow it looks weird as I configured angular/cli in package.json, but it result from npm version is outdated, so I did the npm update

$sudo npm update npm -g

Also the following commands can help check versions and do a clean install via "uninstall -> clean -> install".
$npm --v
$node -v
$sudo npm uninstall -g angular-cli
$sudo npm cache clean
$sudo npm install -g angular-cli@latest

 

CSS overlapping and z-index

In CSS, there are three different things that impact how html elements overlap each other: stacking contexts, source order, and painting order (a.k.a. stacking level).

Stacking contexts
When you apply z-index to a positioned element, you do two things.

First, you say that the element is in front or behind other elements that share the same stacking context. This is what we normally think about when we change z-index -- we want something to move in front or in back of something else.

Second, you create a new stacking context for anything inside the positioned element. Once you've created a stacking context, any layering that happens inside that stacking context stays in that context. This is the part we forget.

In a normal document, without any positioning, the document has exactly one stacking context -- the one created by html. When dealing with positioning, the stacking context is probably the hardest thing to remember.

Source code
There are two different ways of looking at an HTML document source code. One is by reading, from top to bottom, to see which tags start before which tags. The other way to look at this is in tree order where you keep track of not only which tags start first, but also which tags are inside other tags.

Stacking levels (inside of stacking contexts)
Normally, adjusting the z-index property and keeping track of stacking contexts is all you need to worry about. But occasionally you'll run into a situation where one box paints over another, even though there's no positioning involved. This happens because of how data is stacked inside of a stacking context. Just to make things confusing, the specs call this concept stacking levels.

The specs define 7 painting layers. Starting from back to front, they are:

1.     The borders and background of the current stacking context
2.     Positioned descendants with negative z-index (or goes before #1 in modern browsers)
3.     Non-positioned block-level descendants with no z-index property defined -- paragraphs, tables, lists, and so on
4.     Floating descendants and their contents
5.     Non-positioned inline content
6.     Positioned descendants with no z-index, z-index: auto, or z-index: 0
7.     Positioned descendants with z-index greater than 0

Some key points to remember:

1. Source order counts.
2. Inline elements paint over floats.
3. Positioned elements paint on top of everything else if they don't have negative z-index.

http://css-discuss.incutio.com/wiki/Overlapping_And_ZIndex
The reference article has details including examples to explain CSS overlapping within stacking contexts.

快递到中国

需要寄东西到中国，慢点没有关系，但要价格便宜。Google了下，发现除了3大巨头FedEx, UPS, USPS外，好像有好多华人开的快递公司。

http://www.chineseinsfbay.com/company/task_category/key_华人快递.html

网上有人推荐如下的
https://rt-express.com/gen/cn/pub_home.php
https://account.us-ex.com/index.aspx
http://lax.aaeexpress.us/Default.aspx
http://www.stoexpress.us/http://sfexpress.shipgce.com/

一个快递网站如果都没有ssl, 我想还是算了吧。建议多试几个，然后找一个可靠的一直用。

打了2个电话，发现这家cupertino的快递离我很近

利达快递-Lida express
4088882332
10793 S.Blaney Ave, Cupertino, CA, 95014
北京食府，三好拉面plaza内，发新社店内

How to hide iFrame

Sometimes we want to hide iframe from UI for different purposes like preload, download file, toggle effect etc. There are couple of ways to hide iFrame.

• display:none
• visibility:hidden
• set height or width to zero
• set position to offscreen

Here are explanations:

• I don't suggest use display:none because some browsers like Firefox will skip rendering the iframe into DOM, then all logics/codes will not get executed
• visibility:hidden will hide the iframe but will occupy the space
• Set height and width to zero might also need set border to zero using frameBorder
• Move iframe offscreen is an option I prefer using some class like below

             .offscreen {
                  position: absolute;
                  left: -5000px;
             }

clientX/Y, pageX/Y, screenX/Y etc

To get the position relative to the top-left corner of the document, use the pageX and pageY properties.
To get the position of the mouse pointer relative to the top-left corner of the browser window's client area, use use the clientX and clientY properties.
To get the position relative to the top-left corner of the screen, use the screenX and screenY properties.

pageX/Y gives the coordinates relative to the <html> element in CSS pixels.
clientX/Y gives the coordinates relative to the viewport in CSS pixels.
screenX/Y gives the coordinates relative to the screen in device pixels.

pageX/Y coordinates are relative to the top left corner of the whole rendered page (including parts hidden by scrolling)
clientX/Y coordinates are relative to the top left corner of the visible part of the page, "seen" through browser window.
screenX/Y coordinates are relative to the screen, You'll probably never need them in code

http://help.dottoro.com/ljsqnefp.php

There are some other rare attributes for reference only, you'll probably never need them.
layerX
layerY
offsetX
offsetY
x
y

For instance, x/y: Sets or retrieves the x-coordinate of the mouse pointer relative to the top-left corner of the closest relatively positioned ancestor element of the element that fires the event. But x property always returns the position relative to the top-left corner of the document in Google Chrome and Safari.

In summary, Use clientX/Y in most cases.

Domain registrar list

I use GoDaddy to host my domains, but renew price is $19.99 every year, so I am looking for some cheaper alternative for my domains' registrar. Here is the list

namecheap.com
enom.com
hostgator.com
dreamhost.com
name.com
1and1.com
gandi.com
fabulous.com
google
amazon

I will try to transfer to namecheap.com as its renew price is under $10 for .com domain. As its name indicates, it is pretty cheap comparing to other registrars. They also have promo code available in a monthly update. https://www.namecheap.com/promos/coupons.aspx

国庆中秋中国之行

2008年9月30号飞美正式开始H1B的漫长工作经历，到2017年，整整9个年头没有在国内过国庆和中秋了。今年刚好赶上双节，就只身回国探亲 (9/26/2017-10/7/2017)。这个季节回国的机票是非常便宜的，而且国航还有圣何塞航线开通周年的优惠。双程的飞机上乘客都比较少，整排大概3-4个人做，幸运的话，可以一人坐几个位置，非常舒服。再加上国航的服务还可以，10多个小时的飞行不是那么累，特别是回程，11个小时，很快就过去了。

此次的目的主要是探亲。2周不到的时间跑了好几个地方，分别是上海，苏州，扬中，常州。上海见了彭医生，带了点礼物。其他地方就是见家人，同学和朋友。除了家人亲戚外，还见了丁同学(在农庄还见到了好多高中同学包括徐同学、戴同学、苏同学、开勇、耿同学、张荣、王坚、陶局)，张同学(在长江大酒店，有他的发小冯治国行长、发平同学、程咸)，刘同学，海英姐。另外还见到了一些老同事，包括David, Rain, Bryan, Roger, Sophy, 大家在国内过的有滋有味，还跟他们学了掼蛋的扑克牌牌法。也特地去常州见了师兄和师妹，他们刚好假期过来旅游，快1年没有见到他们了，还是比较想念的。因为时间的关系，家人亲戚到没有什么特别的聚会，大多都是微信和简短的寒暄。

中国的变化是月薪日益的。高铁，高速公路，桥梁等基础建设已经把大多数国家甩开很多了；电子支付更是深入人心，无纸张的时代就要到来；通货膨胀也是越来高，房价物价除以汇率后，也深深感到高不可攀。 BAT的互联网3巨头目前的地位还是不可动摇，电子商务，微信，支付宝，度娘，人工智能，凡事想到的领域都有BAT的身影。快递业非常发达，顺丰+N通+菜鸟+京东，覆盖了华夏大地的各个角落，也为电子商务的蓬勃发展提供了基础保障。治安也是非常的好，公共场所都有天眼的监控和严格的安检，在很长的一段时间内，中国肯定不会出现大规模的恐怖袭击，更不要提在美国家常便饭的枪击事件了。

然而泱泱大国在有中国特色的快速经济发展的光环下，也有很多问题。环境、金融、房价、贫富悬殊、复杂的周边形势，都好像是不定时的炸弹。各大媒体不太深入报道这些敏感话题，更多的是名人艺人的花边新闻，媒体好像也思维定势了。沿海城市，低头看城市基础建设，是非常让人佩服的中国速度，但抬头看看那灰蒙蒙的天空，又不得不让人担心中国能够用20年的时间治理好这个日益严重的环境问题嘛？房价已经来到千万人民币的时代，从万元户到千万公寓，也就30年的改革开放时间。北沪深和2线的沿海城市里，有多少房地产创造的千万富翁。强大的政府既保住了房价，也保住了汇率，让世界其他经济体刮目相看。但这个只涨不跌的房地产泡沫究竟会以怎样的形式结局呢？

作为世界的两大经济体，中国和美国各有各的好处。我悲哀的意识到，我和父母永远隔着一个一望无际的太平洋。父母不适应美国，我们不再适应中国。这是每个第一代移民都要付出的代价。我们是回不去了，起码现在，尽管手里还是紧握着中国的护照。

马云金句

态度比能力重要，选择同样也比能力重要！
做企业赢在细节，输在格局。
领导永远不要跟下属比技能，下属肯定比你强。
你的职责是什么？比别人多勤奋一点、多努力一点、多一点理想，这就是你的职责。
如果一辈子都做事的话，忘了做人，将来一定会后悔。
别把抱怨当习惯。
世界不会记得你说了什么，但一定不会忘记你做了什么！
客户第一、员工第二、股东第三。
心态决定姿态，姿态决定状态。
今天很残酷，明天更残酷，后天很美好。
创业最怕就是看不见，看不起，看不懂，跟不上。


https://mp.weixin.qq.com/s/A1xu3Yu4QWV7pzVV5oFxtA

CSP (Content Security Policy)

CSP (Content Security Policy) is a tool which developers can use to lock down their applications in various ways, mitigating the risk of content injection vulnerabilities such as cross-site scripting, and reducing the privilege with which their applications execute.

CSP is not intended as a first line of defense against content injection vulnerabilities. Instead, CSP is best used as defense-in-depth. It reduces the harm that a malicious injection can cause, but it is not a replacement for careful input validation and output encoding.

Besides CSP, Web application should try to avoid Cross-site Scripting (XSS), Cross-Site Request Forgery (CSRF) etc security attacks.

There are two options to implement CSP, one is on server side through HTTP response header, the other is client side through HTML meta element. Here are the details:

The Content-Security-Policy HTTP response header field is the preferred mechanism for delivering a policy from a server to a client.

Content-Security-Policy: script-src 'self';
                         report-to csp-reporting-endpoint

The Content-Security-Policy-Report-Only HTTP response header field allows web developers to experiment with policies by monitoring (but not enforcing) their effects.

Content-Security-Policy-Report-Only: script-src 'self';
                                     report-to csp-reporting-endpoint

A Document may deliver a policy via one or more HTML meta elements whose http-equiv attributes are an ASCII case-insensitive match for the string "Content-Security-Policy".

<meta http-equiv="Content-Security-Policy" content="script-src 'self'">

There are many directives including script-src, frame-src, style-src, image-src etc to define the content security policies. For details, please check out https://www.w3.org/TR/CSP

Fucoidan - 褐藻多糖硫酸酯

Fucoidan is a natural food compound with a funny name that has shown promise in fighting cancer. Found in many forms of brown seaweed, fucoidan is a type of complex carbohydrate called a polysaccrharide and is composed of various sugars, sugar acids and sulfur-containing groups. While seaweed has been a staple food in Asian countries for thousands of years, brown seaweed has only been the focus of research for the past decade. Fucoidan, in particular, has received the most attention.

http://www.cancercenter.com/discussions/blog/fucoidan-may-help-fight-cancer-but-research-is-still-early/

In US market, there are two categories of Fucoidan.

One is imported from Japan price around $300:
Nature Medic Fucoidan Powered with AHCC  (http://www.naturemdc.com/)
Umi No Shizuku Fucoidan Umi - 120 capsules (http://www.kfucoidan.com/
http://www.fucoidanllc.com/)
YOHO MEKABU FUCOIDAN

Another is regular supplement, pricing around $30:
Absonutrix 500mg Fucoidan Pure Brown Seaweed Extract 120 Capsules
Optimized Fucoidan with Maritech 926 - Life Extension - 60 Veggie Caps
Doctor's Best Fucoidan 70%, Non-GMO, Vegan, Gluten Free, 60 Veggie Caps

You can also search Fucoidan on amazon and ebay

Javascript touch events

Javascript has the following touch events:

• touchstart
• touchmove
• touchend
• touchenter
• touchleave
• touchcancel

We usually use the following code snippet to detect touch event support

if ('ontouchstart' in window) {
  /* browser with Touch Events
     running on touch-capable device */
}

if (('ontouchstart' in window) ||
     (navigator.maxTouchPoints > 0) ||
     (navigator.msMaxTouchPoints > 0)) {
      /* browser with either Touch Events or Pointer Events (from Microsoft, outdated)
         running on touch-capable device */
}

To support both touch-capable device and desktop mouse input, we can listen to both touch event and click event, something like below

blah.addEventListener('touchend', function(e) {
  /* prevent delay and simulated mouse events */
  e.preventDefault();
  someFunction()
});
blah.addEventListener('click', someFunction);

If we need all touch events handling for Mobile web, suggest to check out some open source libraries, like jQuery Mobile, hammerjs, or jQuery-Touch-Events.

nginx proxy_pass 502 Bad gateway

I use proxy_pass to proxy local API requests to our dev servers, something like

proxy_pass https://dev-server.com/api

All of a sudden, it stops working with a "502 Bad Gateway" error in browser DevTool network. However I can access https://dev-server.com/api directly using web browser.

It is obvious that nginx upstream fails for some reason. I googled a lot, and most discussions are relating to nginx configuration. However, I didn't change anything to nginx configuration before it stops working. Something happened on api server side?

Yes, our api server turned off TLSv1.0 due to security concern. I checked my local nginx and openssl versions, and realized we have 2 options:
1. Upgrade openssl version
2. Rollback api server changes to allow TLSv1.0

$ /usr/local/nginx/sbin/nginx -v
nginx version: nginx/1.0.15

$ openssl version -a
OpenSSL 0.9.8zh 14 Jan 2016
built on: Jan 23 2017
platform: darwin64-x86_64-llvm
options:  bn(64,64) md2(int) rc4(ptr,char) des(idx,cisc,16,int) blowfish(idx)
compiler: -arch x86_64 -fmessage-length=0 -pipe -Wno-trigraphs -fpascal-strings -fasm-blocks -O3 -D_REENTRANT -DDSO_DLFCN -DHAVE_DLFCN_H -DL_ENDIAN -DMD32_REG_T=int -DOPENSSL_NO_IDEA -DOPENSSL_PIC -DOPENSSL_THREADS -DZLIB -mmacosx-version-min=10.6
OPENSSLDIR: "/System/Library/OpenSSL"

How to enable TLSv1.2 in Nignx?
https://askubuntu.com/questions/319192/how-to-enable-tls-1-2-in-nginx

ssl_protocols TLSv1.2 TLSv1.1 TLSv1;

ssl_ciphers ECDHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES256-SHA:DHE-RSA-AES256-SHA;
ssl_prefer_server_ciphers on;

www.calligraphyus.com website goes live

我们使用Google site很快搭建了一个书法网站来介绍华风书社，非常好用，从框架到版面，大概也就1-2个小时的时间，唯一的问题是存储空间有限，手机访问支持不好，在这个mobile first的时代，感觉有点落伍。我们不想去购买G Suite, 所以就将就了。然后去Godaddy买了个域名，配了下DNS就可以访问 华风书社 (www.calligraphyus.com)

推广网站倒是个头痛的事情，除了传统的SEO优化外，可能最直接的方法就是购买Google AdWords了，但这个每天都要支出的，所以目前不太适合。我们还是看看其他方法，比如多写些blog, 多发布些商家信息，多加些外链。

定搜索关键词也是个头疼的事情，如果有明确的方向或者明确的竞争对手就好些，不然自己就要揣摩用户查找的习惯。我们书社的目的是在旧金山湾区推广书法，教授书法，所以目前定下来的关键词是:湾区 书法。 一个是地点信息，一个是主题，书法学习，书法老师，书法讲座，书法探讨，传统书法等等都有这个主语。

外链的做法就是在湾区比较流行的论坛上或商家黄页上发布信息。

希望越来越多的对中国传统书法感兴趣的湾区家长能够搜到我们的 www.calligraphyus.com

Regexp Lookahead vs Lookbehind

http://www.regular-expressions.info/lookaround.html

Lookahead means look forwards (to the right)
If the regex is x(?=insert_regex_here), which is positive look ahead, that means "find an x that is followed by insert_regex_here".

If the regex is x(?!insert_regex_here), which is negative look ahead, that means "find an x that is not followed by insert_regex_here".

Lookbehind means look backwards (to the left)
If the regex is (?<=insert_regex_here)x, which is positive look behind, that means "find an x that is preceded by insert_regex_here".

If the regex is (?<!insert_regex_here)x, which is negative look behind, that means "find an x not preceded by insert_regex_here"

The above (?=   (?!   (?<=   (?<! etc are Perl regex syntax - the syntax might be slightly different depending on your flavour of regex. You can also use https://regex101.com/ to play around these two concepts in RegExp.

2017 IRA and 401k Contribution Limit

A 403(b) is a retirement plan offered by certain public institutions and tax-exempt organizations.

A 401(k) plan is the tax-qualified, defined-contribution pension account defined in subsection 401(k) of the Internal Revenue Code.

A 457 plan is a type of nonqualified, tax advantaged deferred-compensation retirement plan that is available for governmental and certain non-governmental employers in the United States.

A traditional IRA is a way to save for retirement that gives you tax advantages. Contributions you make to a traditional IRA may be fully or partially deductible, depending on your circumstances, and Generally, amounts in your traditional IRA (including earnings and gains) are not taxed until distributed.

A Roth IRA (individual retirement account) is a retirement plan under US law that is generally not taxed, provided certain conditions are met.

A SIMPLE IRA plan (Savings Incentive Match PLan for Employees) allows employees and employers to contribute to traditional IRAs set up for employees. It is ideally suited as a start-up retirement savings plan for small employers not currently sponsoring a retirement plan.

A SIMPLE 401K plan is a subset of the 401(k) plan. Just like the SIMPLE IRA plan, this is a plan just for you: the small business owner with 100 or fewer employees.

Javascript Keyboard events

Events & event values
There are keydown, keypress, and keyup events. For most keys, browser dispatches a sequence of key events like this:

• When the key is first depressed, the keydown event is sent.
• If the key is not a modifier key, the keypress event is sent.
• When the user releases the key, the keyup event is sent.

In the event object, event.which, event.keyCode and event.charCode are more relating to Javascript programming. 

There is some online testing tool for these keyboard events, for instance

http://www.asquare.net/javascript/tests/KeyCode.html

Using this kind of tool, we can quickly detect the keyCode, which, charCode values from keydown, keypress and keyup events.

Cross browser compatibility

However, different browsers might return different keyCode for same character. For instance, IE/Edge browser returns 229 but Chrome/Firefox returns 50 keyCode from keydown event. If we look at below comparison figure, same browser returns different keyCode value from different keyboard events.  One example here is: keypress event, for same @ char, chrome returns 64 keyCode, but Firefox returns 0 keyCode.

Fortunately, jQuery normalize browser difference for keyCode etc. Further more, jQuery recommends event.which over event.keyCode and event.charCode keyboard events.
http://api.jquery.com/event.which/

The event.which property normalizes event.keyCode and event.charCode. It is recommended to watch event.which for keyboard key input. 

event.which also normalizes button presses (mousedown and mouseupevents), reporting 1 for left button, 2 for middle, and 3 for right. Use event.which instead of event.button.

MDN (Mozilla Developer Network) has the following note:

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/charCode#Notes

In a keypress event, the Unicode value of the key pressed is stored in either the keyCode or charCode property, never both. If the key pressed generates a character (e.g. 'a'), charCode is set to the code of that character, respecting the letter case. (i.e. charCode takes into account whether the shift key is held down). Otherwise, the code of the pressed key is stored in keyCode. charCode is never set in the keydown and keyup events. In these cases, keyCode is set instead.

http://unixpapa.com/js/key.html gives more details regarding keyboard events compatibility landscape across different browsers.

Different Keyboard Layouts

Same character might have different keyCode when using foreign keyboard layouts

Stackoverflow gives some simple solution as below for different keyboard layouts compatiblity:

Use onkeypress to ascertain the correct character code for the key that was pressed. In the event handler, check the event.which and event.keyCode properties:

function whichKey(evt) {

    alert(String.fromCharCode(evt.which || evt.keyCode));

}

KeyboardEvent.key to the rescue?

Model browsers start to support KeyboardEvent.key which should be used to replace charCode etc. 

The definition of 'KeyboardEvent.key' is in  "Document Object Model (DOM) Level 3 Events Specification" Working Draft (as of August 2017).

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key

http://caniuse.com/#feat=keyboardevent-key
Apart from Android browsers, IE11/Edge, other modern browsers have support event.key.

Conclusion

Explore event.key if your web app doesn't need to support legacy browsers.
Use event.which, event.keyCode, and event.charCode wisely in different keyboard events.

ASP.NET Controls

UI controls can help developers quickly build web apps. That is why such kind of library, suite, components get popular. There are many open source libraries, but commercial licenses usually provide more features, more controls and premium support.

.NET controls not only enable developers to build applications with intuitive user interfaces but also enhances productivity. While Microsoft provides standard set of controls with Visual Studio, third party suites contain numerous controls with wide range of unique features for the development of applications for PC and portable mobile devices.

Here is a list I am aware of:

www.telerik.com/devcraft‎
Familiar API, design-time support, app templates and more, using Kendo UI

www.componentone.com/controls
300+ Controls For Mobile, Web & Desktop.

https://www.infragistics.com/products/aspnet
Infragistics Ultimate UI for ASP.NET includes over 60 controls to help you create high-performing, full-featured enterprise apps that look great in any browser.

https://www.devexpress.com/
DevExpress provides best in class user interface controls for WinForms, ASP, MVC, WPF and Silverlight.

https://www.syncfusion.com/products/communitylicense
More than 800 controls and frameworks for web, desktop and mobile development.

ext.net
ASP.NET and ASP.NET MVC Controls and Components integrating the Sencha Ext JS JavaScript Library.

http://www.fineui.us
ASP.NET WebForms/MVC Components for Enterprise Apps, 50+ components with built-in AJAX support for desktop, tablets and phones. It is built based on jQuery with high performance and high quality, very popular in China.

AI Resources

Now and next 5 years, AI will be the next hot spot.

http://www.deeplearningbook.org/
http://neuralnetworksanddeeplearning.com/
http://bigdata-madesimple.com/20-free-books-to-get-started-with-artificial-intelligence/
https://aitopics.org/search

SEO (Search Engine Optimization) 101

Here is a quick summary regarding how to increase search engine ranking and indexing for website. This is a learning note from https://moz.com/beginners-guide-to-seo 

Indexable Content
Provide alt text for images. Assign images in gif, jpg, or png format "alt attributes" in HTML to give search engines a text description of the visual content.
Supplement search boxes with navigation and crawlable links.
Supplement Flash or Java plug-ins with text on the page.
Provide a transcript for video and audio content if the words and phrases used are meant to be indexed by the engines.

Crawlable Link Structures
Submission-required forms
Links in unparseable JavaScript
Links pointing to pages blocked by the Meta Robots tag or robots.txt
Frames or iframes
Robots don't use search forms
Links in Flash, Java, and other plug-ins
Links on pages with many hundreds or thousands of links
Nofollow instructs search engines to not follow a link

Keyword Usage and Targeting
One of the best ways to optimize a page's rankings is to ensure that the keywords you want to rank for are prominently used in titles, text, and metadata.
Keyword density is divorced from content, quality, semantics, and relevance.

Title tags
The title element of a page is meant to be an accurate, concise description of a page's content. It is critical to both user experience and search engine optimization.
Search engines display only the first 65-75 characters of a title tag in the search results

Meta Tags
Meta Robots
The Meta Robots tag can be used to control search engine crawler activity (for all of the major engines) on a per-page level

Meta Description
Search engines do not use the keywords or phrases in this tag for rankings, but meta descriptions are the primary source for the snippet of text displayed beneath a listing in the results.
Meta descriptions can be any length, but search engines generally will cut snippets longer than 160 characters, so it's generally wise to stay within in these limits.

Meta Keywords:
The meta keywords tag had value at one time, but is no longer valuable or important to search engine optimization.
 
URL Construction Guidelines
Employ empathy
Shorter is better
Keyword use is important (but overuse is dangerous)
Go static
Use hyphens to separate words

Link Building Basics
"Natural" Editorial Links
Manual "Outreach" Link Building
Self-Created, Non-Editorial
 
Five Samples of Link Building Strategies
Get your customers to link to you
Build a company blog; make it a valuable, informative, and entertaining resource
Create content that inspires viral sharing and natural linking
Be newsworthy
 
Canonical and Duplicate Versions of Content
Use the canonical tag within the page that contains duplicate content. The target of the canonical tag points to the master URL that you want to rank for.
<link rel="canonical" href="https://example.com/master-URL"/>
 
Rich Snippets
itemscope, itemtype, itemprop datetime

How scrapers steal your rankings
you'll need to use absolute, rather that relative links in your internal linking structure. This way, when a scraper picks up and copies the content, the link remains pointing to your site.
 
How to Judge the Value of a Keyword
Search for the term/phrase in the major engines
Buy a sample campaign for the keyword at Google AdWords and/or Bing Adcenter
Using the data you’ve collected, determine the exact value of each keyword
 
Understanding the Long Tail of Keyword Demand
popular search terms actually make up less than 30% of the searches performed on the web. The remaining 70% lie in what's called the "long tail" of search.

Tools
Google search console
Bing webmaster
others including moz products

Amazon Shopping Tips and Tricks

I shop online with Amazon.com very often, so summarize some tips and tricks regarding the shopping experience.

Amazon prime
Suggest to enroll with your friends to split the cost for FREE 2 days shipping for all primary members. The account owner also gets unlimited video streaming service.

No-Rush shipping reward
If you buy something and choose no-rush shipping, you will get credits for Digital, prime panty or prime now. The rewards have expiry date, usually 3 months. You can check the balance from https://www.amazon.com/norushcredits

Amazon Smile
Always shop through https://smile.amazon.com to donate to your selected charity (like home school, your church etc) while you are shopping with Amazon.

Amazon Assistant
You can install "Amazon Assistant" browser extension to quickly access Amazon, search product, track your orders, see today's deals, and add product to your wish list. This is a very handy extension to help you shop with Amazon.

Return your purchase
Amazon only provides 30 days return window, so act quickly if you don't like the purchase. For prime member, the return shipping is free as well. When you return something, select a reason which does not cost you shipping fee. Drop to UPS is a convenient way as they are many UPS stores.


Price Match
Amazon doesn't provide price match. The easiest way is to buy a new one, then return the old one if it is still in return order. I usually chatted with their support, they can provide price adjustment, but recently they change this, and prefer buy-and-return flow with extra shipping cost. I guess Amazon shipping cost with UPS or USPS is very low.

Trip recommendations

Lake Tahoe Summer:
Famous for ski, but also excellent place for summer fun. about 4 hours drive from bay area.
Rock cave rafting with own boat
Emerald Bay: eagle fall trail to watch waterfall, then vikingsholm trail to beach, to rent boat
Baldwin Beach Park: biking trail

City of Ten Thousand Buddhas
The city is situated in Talmage, Mendocino County, California. It is one of the first Chinese Zen Buddhist temples in the United States, and one of the largest Buddhist communities in the Western Hemisphere. About 4.5 hours drive from bay area.

Recommended dividend stocks in 2017 Summer

APPLE (1.77%)
AT&T (5.03%)
Boeing (2.89%)
Pfizer (3.86%) Pharmaceutical (Viagra drug)
Merck (2.95%) Pharmaceutical
Tyson Foods (1.46%)
Texas Instruments (2.46%)
Expeditors International (1.47%)
Hormel Foods (2.01%)
Verizon (5.1%)
Johnson & Johnson (2.47%)
Comcast (1.58%)
Microsoft (2.22%)
JP Morgan (2.3%)

人工智能简史-2

以下学习笔记摘自https://book.douban.com/reading/35613939/
版权属于原作者

人工智能进入21世纪后开始进一步分化，出现了很多面向具体应用的新兴学科，包括自动定理证明，模式识别，机器学习，自然语言理解，计算机视觉，自动程序设计。每一个领域都包含大量具体的技术和专业知识以及特殊的应用背景，不同分支之间也几乎是老死不相往来，大一统的人工智能之梦仿佛破灭了。

麻省理工学院的乔希•特南鲍姆（Josh Tenenbaum）以及斯坦福大学的达芙妮•科勒（Daphne Koller）试图重新构建统一的模式。他们的特立独行起源于对概率这个有着几百年历史的数学概念的重新认识，并利用这种认识来统一人工智能的各个方面，包括学习、知识表示、推理以及决策。这样的认识是源于贝叶斯的主观概率学。贝叶斯公式表达了智能主体如何根据搜集到的信息改变对外在事物的看法，概括了人们的学习过程。以贝叶斯公式为基础，人们发展出了一整套称为贝叶斯网络的方法。在这个网络上，研究者可以展开对学习、知识表示和推理的各种人工智能的研究。随着大数据时代的来临，贝叶斯方法所需要的数据也是唾手可得，这使得贝叶斯网络成为了人们关注的焦点。

澳大利亚国立大学的马库斯•胡特（Marcus Hutter）在2000年的时候就开始尝试建立一个新的学科：通用人工智能（Universal Artificial Intelligence），他认为现在主流的人工智能研究已经严重偏离人工智能这个名称的本意。我们不应该将智能化分成学习、认知、决策、推理等分立的不同侧面。事实上，对于人类来说，所有这些功能都是智能作为一个整体的不同表现。胡特的理论至少为统一人工智能开辟了新方向，让我们看到了统一的曙光。

21世纪的第二个十年，如果要评选出最惹人注目的人工智能研究，那么一定要数深度学习（Deep Learning）了。谷歌、微软、苹果、百度这些全球顶尖的计算机、互联网公司都不约而同地对深度学习表现出了极大的兴趣。事实上，深度学习仍然是一种神经网络模型，只不过这种神经网络具备了更多层次的隐含层节点，同时配备了更先进的学习技术。当我们将超大规模的训练数据喂给深度学习模型的时候，这些具备深层次结构的神经网络仿佛摇身一变，成为了拥有感知和学习能力的大脑，表现出了远远好于传统神经网络的学习和泛化的能力。深度学习实际上只不过是对大脑的一种模拟。各国的科学家也开始进行模拟大脑的大项目，脑科学的时代已经来临。

007年，一位谷歌的实习生路易斯•冯•安（Luis von Ahn）开发了一款有趣的程 “ReCapture”，却无意间开创了一个新的人工智能研究方向：人类计算。这一成功的应用实际上是借助人力完成了传统的人工智能问题，冯•安把它叫作人类计算（Human Computation）。也许，这样巧妙的人机结合才是人工智能发展的新方向之一。因为一个完全脱离人类的人工智能程序对于我们没有任何独立存在的意义，所以人工智能必然会面临人机交互的问题。而随着互联网的兴起，人和计算机交互的方式会更加便捷而多样化。因此，这为传统的人工智能问题提供了全新的解决途径。

人工智能走到21世纪的第二个十年的时候，随着太空探索、自动驾驶、语音识别、文字识别、AlphaGo、Google Home, Amazon Echo, Apple Siri 等等应用的普及和发展，有带来了一波新的机遇。成为云计算移动应用后的新的技术方向。 可以很肯定的说，下一个十年一定是人工智能的十年！

推荐阅读

• 关于希尔伯特、图灵、哥德尔的故事和相关研究可以阅读《哥德尔、艾舍尔、巴赫：集异璧之大成》一书。
• 关于冯•诺依曼，可以阅读他的传记：《天才的拓荒者：冯•诺依曼传》。
• 关于维纳，可以参考他的著作《控制论》。
• 若要全面了解人工智能，给大家推荐两本书：Artificial Intelligence: A Modern Approach和Artificial Intelligence: Structures and Strategies for Complex Problem Solving。
• 了解机器学习以及人工神经网络可以参考Pattern Recognition和Neural Networks and Learning Machines。
• 关于行为学派和人工生命，可以参考《数字创世纪：人工生命的新科学》以及人工生命的论文集。
• 若要深入了解贝叶斯网络，可以参考Causality: Models, Reasoning, and Inference。
• 深入了解胡特的通用人工智能理论可以阅读Universal Artificial Intelligence: Sequential Decisions Based on Algorithmic Probability。
• 关于深度学习方面的知识可参考网站：http://deeplearning.net/reading-list/，其中有不少综述性的文章。
• 人类计算方面可以参考冯•安的网站：http://www.cs.cmu.edu/~biglou/

人工智能简史-1

电影中《机械姬》《终结者》《黑客帝国》 《机器人瓦利》《人工智能》《超验骇客》《超体》等等都是好莱坞对未来人工智能的愿景。现实生活中的搜索引擎、邮件过滤器、智能语音助手Siri、二维码扫描器、游戏中的NPC(非玩家扮演角色) 都是人工智能的应用。最近火热的人机大战，AlphaGo再次把人工智能的发展推向了一个高潮。学术届和各大公司(Google, Apple, Amazon, Facebook等等)对人工智能的发展充满了信心，也重拾起新一轮的学习研究热潮。可以肯定的说，未来的10年是人工智能的10年。

以下学习笔记摘自https://book.douban.com/reading/35613939/版权属于原作者

历史上，研究人工智能就像是在坐过山车，忽上忽下。梦想的肥皂泡一次次被冰冷的科学事实戳破，科学家们不得不一次次重新回到梦的起点。作为一个独立的学科，人工智能的发展非常奇葩。它不像其他学科那样从分散走向统一，而是从1956年创立以来就不断地分裂，形成了一系列大大小小的子领域。也许人工智能注定就是大杂烩，也许统一的时刻还未到来。然而，人们对人工智能的梦想却是永远不会磨灭的。

从早期的哥德尔、图灵等人的研究到“人工智能”一词的提出，再到后期的人工智能三大学派：符号学派、连接学派和行为学派，以及近年来的新进展：贝叶斯网络、深度学习、通用人工智能。

梦的开始（1900—1956）
人工智能之梦开始于一小撮20世纪初期的数学家。1900年，世纪之交的数学家大会在巴黎如期召开，德高望重的老数学家大卫•希尔伯特（David Hilbert）庄严地向全世界数学家们宣布了23个未解决的难题。这23道难题道道经典，而其中的第二问题和第十问题则与人工智能密切相关，并最终促成了计算机的发明。希尔伯特第二问题：证明数学系统中应同时具备一致性（数学真理不存在矛盾）和完备性（任意真理都可以被描述为数学定理）。希尔伯特第十问题的表述是：“是否存在着判定任意一个丢番图方程有解的机械化运算过程。”

捷克人库尔特•哥德尔（Kurt Godel）于1931年提出了被美国《时代周刊》评选为20世纪最有影响力的数学定理：哥德尔不完备性定理。根据哥德尔定理，必然存在着某种人类可以构造、但是机器无法求解的人工智能的“软肋”。所以，存在着人类可以求解但是机器却不能解的问题，人工智能不可能超过人类。

艾伦•图灵（Alan Turing）被希尔伯特的第十问题深深地吸引了，并决定为此奉献一生。他设想出了一个机器——图灵机，它是计算机的理论原型，圆满地刻画出了机械化运算过程的含义，并最终为计算机的发明铺平了道路。 图灵在1950年发表了《机器能思考吗？》一文，提出了这样一个标准：如果一台机器通过了“图灵测试”，则我们必须接受这台机器具有智能。
2014年6月12日，一个名为“尤金”（Eugene Goostman）的聊天程序成功地在5分钟内蒙骗了30%的人类测试者，从而达到了图灵当年提出来的标准。很多人认为，这款程序具有划时代的意义，它是自图灵测试提出64年后第一个通过图灵测试的程序。

1945年，匈牙利天才少年约翰•冯•诺依曼（John von Neumann）凭借出众的才华，在火车上完成了早期的计算机EDVAC的设计，并提出了我们现在熟知的“冯•诺依曼体系结构”。冯•诺依曼的计算机与图灵机是一脉相承的，但最大的不同就在于，冯•诺依曼的读写头不再需要一格一格地读写纸带，而是根据指定的地址，随机地跳到相应的位置完成读写。这也就是我们今天所说的随机访问存储器（Random Access Memory，RAM）的前身。冯•诺依曼的计算机终于使得数学家们的研究结出了硕果，也最终推动着人类历史进入了信息时代，使得人工智能之梦成为了可能。

美国的天才神童诺伯特•维纳（Norbert Wiener）于1948年提出来的新兴学科“控制论”（Cybernetics），在控制论中，维纳深入探讨了机器与人的统一性——人或机器都是通过反馈完成某种目的的实现，因此他揭示了用机器模拟人的可能性，这为人工智能的提出奠定了重要基础。维纳也是最早注意到心理学、脑科学和工程学应相互交叉的人之一，这促使了后来认知科学的发展。

梦的延续（1956—1980）
1956年8月，在美国汉诺斯小镇宁静的达特茅斯学院中，约翰•麦卡锡（John McCarthy）、马文•闵斯基（Marvin Minsky，人工智能与认知学专家）、克劳德•香农（Claude Shannon，信息论的创始人）、艾伦•纽厄尔（Allen Newell，计算机科学家）、赫伯特•西蒙（Herbert Simon，诺贝尔经济学奖得主）等科学家正聚在一起，讨论着一个完全不食人间烟火的主题：用机器来模仿人类学习以及其他方面的智能。会议足足开了两个月的时间，虽然大家没有达成普遍的共识，但是却为会议讨论的内容起了一个名字：人工智能。因此，1956年也就成为了人工智能元年。

达特茅斯会议之后，人工智能获得了井喷式的发展。 然而，历史似乎故意要作弄轻狂无知的人工智能科学家们。1965年，机器定理证明领域遇到了瓶颈，计算机推了数十万步也无法证明两个连续函数之和仍是连续函数。最糟糕的事情发生在机器翻译领域，对于人类自然语言的理解是人工智能中的硬骨头。越来越多的不利证据迫使政府和大学削减了人工智能的项目经费，这使得人工智能进入了寒冷的冬天。

经历了短暂的挫折之后，AI研究者们开始痛定思痛。爱德华•费根鲍姆（Edward A. Feigenbaum）就是新生力量的佼佼者，他举着“知识就是力量”的大旗，很快开辟了新的道路。在费根鲍姆的带领下，一个新的领域专家系统诞生了。所谓的专家系统就是利用计算机化的知识进行自动推理，从而模仿领域专家解决问题。第一个成功的专家系统DENDRAL于1968年问世，它可以根据质谱仪的数据推知物质的分子结构。在这个系统的影响下，各式各样的专家系统很快陆续涌现，形成了一种软件产业的全新分支：知识产业。1977年，在第五届国际人工智能大会上，费根鲍姆用知识工程概括了这个全新的领域。在知识工程的刺激下，日本的第五代计算机计划、英国的阿尔维计划、西欧的尤里卡计划、美国的星计划和中国的863计划陆续推出。

群龙问鼎（1980—2010）
专家系统、知识工程的运作需要从外界获得大量知识的输入，而这样的输入工作是极其费时费力的，这就是知识获取的瓶颈。于是，在20世纪80年代，机器学习这个原本处于人工智能边缘地区的分支一下子成为了人们关注的焦点。

事实上，在人工智能界，很早就有人提出过自下而上的涌现智能的方案，只不过它们从来没有引起大家的注意。一批人认为可以通过模拟大脑的结构（神经网络）来实现，而另一批人则认为可以从那些简单生物体与环境互动的模式中寻找答案。他们分别被称为连接学派和行为学派。与此相对，传统的人工智能则被统称为符号学派。自20世纪80年代开始，到20世纪90年代，这三大学派形成了三足鼎立的局面。

约翰•麦卡锡（John McCarthy） 作为符号学派的代表，人工智能的创始人之一约翰•麦卡锡在自己的网站上挂了一篇文章《什么是人工智能》，为大家阐明什么是人工智能（按照符号学派的理解）。计算机博弈（下棋）方面的成功就是符号学派名扬天下的资本。1989年5月11日，“深蓝”最终以3.5:2.5的成绩战胜了卡斯帕罗夫，成为了人工智能的一个里程碑。时隔14年后，另外一场在IBM超级计算机和人类之间的人机大战刷新了记录，也使得我们必须重新思考机器是否能战胜人类这个问题。场人机大战的游戏叫作《危险》（Jeopardy），是美国一款著名的电视节目。在2011年2月14日到2月16日期间的《危险》比赛中，IBM公司的超级计算机沃森（Watson）却战胜了人类选手。20世纪80年代以后，符号学派的发展势头已经远不如当年了，因为人工智能武林霸主的地位很快就属于其他学派了。

如果将智力活动比喻成一款软件，那么支撑这些活动的大脑神经网络就是相应的硬件。于是，主张神经网络研究的科学家实际上在强调硬件的作用，认为高级的智能行为是从大量神经网络的连接中自发出现的，因此，他们又被称为连接学派。

连接学派的研究成果代表就是神经网络。最早的神经网络研究可以追溯到1943年计算机发明之前。当时，沃伦•麦卡洛克（Warren McCulloch）和沃尔特•匹兹（Walter Pitts）二人提出了一个单个神经元的计算模型。1957年，弗兰克•罗森布拉特（Frank Rosenblatt）对麦卡洛克匹兹模型进行了扩充，即在麦卡洛克匹兹神经元上加入了学习算法，扩充的模型有一个响亮的名字：感知机。1969年，人工智能界的权威人士马文•闵斯基给连接学派带来了致命一击。他通过理论分析指出，感知机并不像它的创立者罗森布拉特宣称的那样可以学习任何问题。连一个最简单的问题：判断一个两位的二进制数是否仅包含0或者1（即所谓的XOR问题）都无法完成。这一打击是致命的，本来就不是很热的神经网络研究差点就被闵斯基这一棒子打死了。1974年，人工智能连接学派的救世主杰夫•辛顿（Geoffrey Hinton）终于出现了。他提出：只要把多个感知机连接成一个分层的网络，那么，它就可以圆满地解决闵斯基的问题。他还发现采用几年前阿瑟•布赖森（Arthur Bryson）等人提出来的反向传播算法（Back propagation algorithm，简称BP算法）就可以有效解决多层网络的训练问题。

2000年左右，弗拉基米尔•万普尼克（Vladimir Naumovich Vapnik）和亚历克塞•泽范兰杰斯（Alexey Yakovlevich Chervonenkis）这两位俄罗斯科学家提出了一整套新的理论：统计学习理论，受到连接学派的顶礼膜拜。 然而，统计学习理论也有很大的局限性，因为理论的严格分析仅仅限于一类特殊的神经网络模型：支持向量机（Supporting Vector Machine）。而对于更一般的神经网络，人们还未找到统一的分析方法。所以说，连接学派的科学家们虽然会向大脑学习如何构造神经网络模型，但实际上他们自己也不清楚这些神经网络究竟是如何工作的。

行为学派的出发点与符号学派和连接学派完全不同，他们并没有把目光聚焦在具有高级智能的人类身上，而是关注比人类低级得多的昆虫。罗德尼•布鲁克斯（Rodney Brooks）是一名来自美国麻省理工学院的机器人专家。在他的实验室中有大量的机器昆虫。这些机器昆虫没有复杂的大脑，也不会按照传统的方式进行复杂的知识表示和推理。它们甚至不需要大脑的干预，仅凭四肢和关节的协调，就能很好地适应环境。当我们把这些机器昆虫放到复杂的地形中的时候，它们可以痛快地爬行，还能聪明地避开障碍物。它们看起来的智能事实上并不来源于自上而下的复杂设计，而是来源于自下而上的与环境的互动。这就是布鲁克斯所倡导的理念。

如果说符号学派模拟智能软件，连接学派模拟大脑硬件，那么行为学派就算是模拟身体了，而且是简单的、看起来没有什么智能的身体。例如，行为学派的一个非常成功的应用就是美国波士顿动力公司（Boston Dynamics）研制开发的机器人“大狗” 。

约翰•霍兰（John Holland）是美国密西根大学的心理学、电器工程以及计算机的三科教授。他在读博期间就对如何用计算机模拟生物进化异常着迷，并最终发表了他的遗传算法。遗传算法对大自然中的生物进化进行了大胆的抽象，最终提取出两个主要环节：变异（包括基因重组和突变）和选择。在计算机中，我们可以用一堆二进制串来模拟自然界中的生物体。而大自然的选择作用——生存竞争、优胜劣汰——则被抽象为一个简单的适应度函数。这样，一个超级浓缩版的大自然进化过程就可以搬到计算机中了，这就是遗传算法。遗传算法比神经网络具有更方便的表达性和简单性。

无论是机器昆虫还是进化计算，科学家们关注的焦点都是如何模仿生物来创造智能的机器或者算法。克里斯托弗•兰顿（Chirstopher Langton）进行了进一步提炼，提出了“人工生命”这一新兴学科。人工生命与人工智能非常接近，但是它的关注点在于如何用计算的手段来模拟生命这种更加“低等”的现象。“涌现”（emergence）这个词是人工生命研究中使用频率最高的词之一，它强调了一种只有在宏观具备但不能分解还原到微观层次的属性、特征或行为。单个的蛋白质分子不具备生命特征，但是大量的蛋白质分子组合在一起形成细胞的时候，整个系统就具备了“活”性，这就是典型的涌现。


三大学派间的关系
正如我们前面提到的，这三个学派大致是从软件、硬件和身体这三个角度来模拟和理解智能的。但是，这仅仅是一个粗糙的比喻。事实上，三大学派之间还存在着很多微妙的差异和联系。

首先，符号学派的思想和观点直接继承自图灵，他们是直接从功能的角度来理解智能的。他们把智能理解为一个黑箱，只关心这个黑箱的输入和输出，而不关心黑箱的内部构造。因此，符号学派利用知识表示和搜索来替代真实人脑的神经网络结构。符号学派假设知识是先验地存储于黑箱之中的，因此，它很擅长解决利用现有的知识做比较复杂的推理、规划、逻辑运算和判断等问题。

连接学派则显然要把智能系统的黑箱打开，从结构的角度来模拟智能系统的运作，而不单单重现功能。这样，连接学派看待智能会比符号学派更加底层。这样做的好处是可以很好地解决机器学习的问题，并自动获取知识；但是弱点是对于知识的表述是隐含而晦涩的，因为所有学习到的知识都变成了连接权重的数值。我们若要读出神经网络中存储的知识，就必须要让这个网络运作起来，而无法直接从模型中读出。连接学派擅长解决模式识别、聚类、联想等非结构化的问题，但却很难解决高层次的智能问题（如机器定理证明）。

行为学派则研究更低级的智能行为，它更擅长模拟身体的运作机制，而不是脑。同时，行为学派非常强调进化的作用，他们认为，人类的智慧也理应是从漫长的进化过程中逐渐演变而来的。行为学派擅长解决适应性、学习、快速行为反应等问题，也可以解决一定的识别、聚类、联想等问题，但在高级智能行为（如问题求解、逻辑演算）上则相形见绌。

有意思的是，连接学派和行为学派似乎更加接近，因为他们都相信智能是自下而上涌现出来的，而非自上而下的设计。但麻烦在于，怎么涌现？涌现的机制是什么？这些深层次问题无法在两大学派内部解决，而必须求助于复杂系统科学。

三大学派分别从高、中、低三个层次来模拟智能，但现实中的智能系统显然是一个完整的整体。我们应如何调解、综合这三大学派的观点呢？这是一个未解决的开放问题，而且似乎很难在短时间内解决。主要的原因在于，无论是在理论指导思想还是计算机模型等方面，三大学派都存在着太大的差异。

于是，就这样磕磕碰碰地，人工智能走入了新的世纪。到了2000年前后，人工智能的发展非但没有解决问题，反而引入了一个又一个新的问题，这些问题似乎变得越来越难以回答，而且所牵扯的理论也越来越深。于是，很多人工智能研究者干脆当起了“鸵鸟”，对理论问题不闻不问，而是一心向“应用”看齐。争什么争呀，实践是检验真理的唯一标准，无论是符号、连接、行为，能够解决实际问题的鸟就是好鸟。

ReadyRefresh sucks

In May, there was a promotion (spend $30, credit $15) from AMEX to buy online with ReadyRefresh which looks like a beverage delivery service, but my experience shows it totally sucks and looks like a scam. I never ever will use their service, even free stuff. If you see this post and never try ReadyRefresh, I hope it can help you out.

I totally ordered 8 items which amount is about $33, just above the promotion credit threshold. However, the online order confirmation page (see below) immediately gave me the impression, the service sucks because I see two amounts on the single same page.

I was more confusing when I got below email summary for my first order.

 

This happened on the same hour, three different charge amount: $30.71  $33.45 and $28.03.

I got my first (and last) order from ReadyRefresh delivered on Monday. Guess what, I expected total 8 items, but only 6 items got delivered. There was no any delivery confirmation email or delivery statement, just the boxes (original beverage package like we get from local store) dumped in front of my front door. I am an Amazon fan, if you are an Amazon frequent shopper, you will understand my feeling when see such a delivery experience.  I carefully examine the 6 items, 3 items are with expiration date just in July and August. I totally got mad about these delivery.

The second day, I called ReadyRefresh customer support number (1-866-813-4939 show on their website https://www.readyrefresh.com/). The only good experience is the call center wait time is short, about 1-2 minutes, I got some representative talking with me. I explained the reason I called. The representative told me she will make a note to deliver the missing 2 items without charge. Well, I got the 2 items delivered 2 days later. However, I noticed 2 more charges on my bank activities on June 2nd. Before June 2nd, I notice my banking hold amount keep changing, and finally I was charged $29.33 on May 24. (Please note the amount is just a bit lower than the threshold of AMEX promotion $30, by purpose or not, who knows).

I have to call their customer support again for these 2 extra charges. I was asked to check my online account activities, and the support representative explained all these charges are correct.

 

She explained the extra $1.20 is for CRV deposit, and $14.14 is for one box of Nestle 1/2 water (24 bottles) delivery. I can get such box of water from local store about $2.99+CRV. She then told me there was a delivery fee included, and she will credit that amount. I asked why I was not explained when I made the first call for 2 missing items, and asked if I can return this order. (I didn't use due to so many items are expiring very shortly, I plan to throw them away) The answer is: I cannot return any thing. I got mad from above experience with the 1st ever order from ReadyRefresh, I requested to talk to her supervisor or escalate to someone. Finally I got a callback from supervisor, and she promised to credit back the $15.34 amount (charged on June 2nd). Thanks to the final result, but considering the time I spent on this, it is far more than such a lunch cost. (You know what, I plan to dispute the charges with credit card company if they don't want to credit).

I could not trust ReadyRefresh from the moment I saw 2 different amount numbers right after I placed my order, so I took all screenshot, recorded all conversations as a proof. Now I better understand why Amazon is the best online shopping experience in USA (from my experience). 

Go Amazon, Skip ReadyRefresh. That is the whole point I wrote this blog about my shopping experience with ReadyRefresh.

Best flight booking websites

https://www.flychina.com
https://www.kayak.com/
https://www.justfly.com/
http://www.airfarewatchdog.com/

If you find best price, also check official website, sometimes they have promotion which can save you additional amount.

1.中文常用机票网站大全
www.qunar.com

www.ctrip.com

www.taobao.com (阿里的飞猪)

www.kuxun.com

www.yiqifei.com

www.flychina.com

www.e-traveltochina.com

2. 英文常用机票网站大全
www.kayak.com

kayak是众所周知的机票网站就不多介绍了，在他家订机票需要注意的是 ：机票过分追求便宜价格时，把不同航空公司的航段拼凑一起，会造成一些转机延误、行李等问题）

www.priceline.com

priceline是目前美国最大的在线旅游公司。在Priceline网站，最直观的可选项目就是机票、酒店、租车、旅游保险，机票价格偏贵。他家的bid your price的业务，这个功能支持在机票紧张时你输入一个比较低的报价，系统会自动征询所有的航空公司。如果有航空公司愿意接受这个报价 ，你就赚到了。

www.studentuniverse.com

学生可以试一下，需要是由edu结尾的邮箱来注册订购。

www.travelocity.com

Travelocity 类似于国内的E龙，携程，同程，去哪儿等预订服务类网商，机票搜索引擎。

www.lastminute.com

就像它的名字，这个网站是那些不到起飞前不买机票的人的救命稻草。

www.Expedia.com

超级牛的旅行预订网站。

还有像Cheapoair，Hotwire等等吧，这些网站如果有coupon就会有超值机票。

 

Copy folder from local to remote or vice versa

Option 1: scp -r
To copy all from Local Location to Remote Location (Upload)
scp -r /path/to/file username@hostname:/path/to/destination

To copy all from Remote Location to Local Location (Download)
scp -r username@hostname:/path/to/file /path/to/destination

Custom Port where xxxx is custom port number
scp -r -p xxxx username@hostname:/path/to/file /path/to/destination

Copy on current directory from Remote to Local
scp -r username@hostname:/path/to/file .


Option 2: zip to file then scp
Better to first compress catalog on remote server:
tar czfP backup.tar.gz /path/to/catalog

Secondly, download from remote:
scp user@your.server.example.com:/path/to/backup.tar.gz .

At the end, extract the files:
tar -xzvf backup.tar.gz

Option 3: sftp
$ sftp user_remote@remote_ip
sftp> cd /path/to/remoteDir
sftp> get -r remoteDir

Transfer files between Host and Client using Microsoft Remote Desktop

Transfer files between Host and Client using Microsoft Remote Desktop

1. Open Microsoft Remote Desktop for Mac
2. Goto "My Desktops" and choose your Connection (either to either Mac or Windows)
3. Select "Edit"
4. Goto the Tab "Redirection" in Edit dialog
5. Check "Enable Folder redirection"
6. On the bottom, click the "+" sign, following select the "Path" under "Browse" you want to redirected
7. When you connect to the Remote Computer you can see the redirected Folder under "Computer" (You might need restart the remote session to make redirection take effect)
8. From remote Windows, you can access the redirected folder from Mac

PS: Microsoft Remote Desktop is a free Mac OSX app available on apple store

requirejs loads JavaScript files

RequireJS loads all code relative to a baseUrl.

Requirejs encourages using module IDs instead of URLs for script tags, it loads all codes relative to baseUrl. RequireJS also assumes by default that all dependencies are scripts, so it does not expect to see a trailing ".js" suffix on module IDs.

However, there may be times when you do want to reference a script directly and not conform to the "baseUrl + paths" rules for finding it. For instance, we want to add cache bust to the URL for specific js files rather than all js files (through urlArgs config option).

If a module ID has one of the following characteristics, the ID will not be passed through the "baseUrl + paths" configuration, and just be treated like a regular URL that is relative to the document:

• Ends in ".js".
• Starts with a "/".
• Contains an URL protocol, like "http:" or "https:".

One example is:

var i18nModule = 'i18n!/scripts/customize/nls/lang.js?v=4.0';
require([i18nModule], function(obj) {
    // process the loaded file
});

Above example tells requirejs NOT conform to baseUrl+paths rule, instead load the lang.js file directly using relative path to document (root path). Note that i18nModule variable starts with a "/", and also ends in ".js".

ESPP tax return

ESPP is a common income for corporate employees. When report tax, it actually has 2 parts.

1.  1099-B which reports the proceeds and cost basis
2.  Form 3922 which reports the adjustment due to ESPP benefits

FMV per share on grant date
FMV per share on exercise date
Exercise price paid per share

Usually the adjustment is MIN( FMV-grant date,  FMV-exercise date) * 15% = Exercise price paid

The part of amount is already reported in W2 and explained in Form 3922, so we need do adjustment the amount for 1099-B form.

For instance, if 1099-B reports proceeds $1000, and cost basis $800, the taxable amount is $200.
However, if 3922 adjustment is $50, the total taxable income is $200-$50 = $150.