OmniAICreator/Qiita-1.07M huggingface dataset:
AWSを操作(AWS CLIに限らない)する場合の環境変数設定作業を軽くする

# 今回解決できたこと
AWS CLIなどで利用するプロファイルを(少なくとも僕の中では)リーズナブルな方法で切り替えることが出来るようになりました。

## 困っていたこと
管理すべきAWS credentialがある程度のボリュームになり、CLIツールやterraform/kumogataなどの関連ツールを使う際にもなにかと手間がかかるようになってきています。

## どう解決したいか
せっかく `~/.aws/credentials` に情報があるのでそのまま活用したい。
但し、コピペなどの原始的な手段は回避したい。
そもそもどういうprofileがあるか覚えていないので一覧が出せる仕組みがあることが望ましい。

## なにが解決出来るか

以下のような利用において、profileの切り替えが用意になることを期待します。
- AWS cli
- Codenize.tools
- TerraformなどのHashiCorpツール

# 解決への道
## 世の中には同じことに悩んでいる人がいるはず
いらっしゃった上に、解決されていました。

[awsenv](https://github.com/bdclark/awsenv) (at GitHub)

## 導入

[Installation](https://github.com/bdclark/awsenv#installation) の項目そのままで問題なくインストールできます。
以降の部分で、一部情報を意図的に削ったり伏せたりしていますが雰囲気はお伝えできると思います。

## profileの切り替え
私の場合、 `~/.aws/credentials` に `saitara` というprofileがありますので、そちらを利用するようsetawsで指定します。

```
% setaws saitara
```

## awsenvで確認

```
% awsenv 

Current AWS Environment Variables:

AWS_SECRET_KEY matches ['saitara']
AWS_SSH_KEY_PATH not set
AWS_DEFAULT_REGION matches ['saitara']
AWS_SECRET_ACCESS_KEY matches ['saitara']
AWS_VAGRANT_SUBNET_ID not set
AWS_ACCESS_KEY matches ['saitara']
AWS_VAGRANT_SECURITY_GROUP not set
AWS_ACCESS_KEY_ID matches ['saitara']
AWS_SSH_KEY_ID not set
```

## exportで確認
環境変数も併せて確認しましょう。

```
% export| grep AWS_
AWS_ACCESS_KEY=XXXXXXXXXXXXXXXXXX
AWS_ACCESS_KEY_ID=XXXXXXXXXXXXXXXXXX
AWS_CONFIG_FILE=/Users/saitara/.aws/credentials
AWS_DEFAULT_REGION=us-west-2
AWS_SECRET_ACCESS_KEY=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
AWS_SECRET_KEY=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
```
PhotoshopのJavaScriptで「WEB用 に保存」のgifの書き出し設定にハマる

PhotoshopのJavaScriptを使用して「WEB用 に保存」を実行したところ、大した画像でもないのにgifで書き出すとかなり荒い画像になってしまう。

```js
var option = new ExportOptionsSaveForWeb(); //「WEB用 に保存」の設定
option .format = SaveDocumentType.COMPUSERVEGIF; //ファイル形式を「gif」に設定

//「WEB用 に保存」を実行
activeDocument.exportDocument('ファイル名', ExportType.SAVEFORWEB, option);
```

原因を調べるために、一緒に保存していたpsdファイルを確認すると、【劣化】の値に60が設定されていた。
![gif_quality.png](https://qiita-image-store.s3.amazonaws.com/0/54330/5de2d4ec-92fe-a6ae-6f90-5d342af5276a.png)

そこでデフォルトで60の値を設定するプロパティを[公式ドキュメント](http://cssdk.s3-website-us-east-1.amazonaws.com/sdk/1.0/docs/WebHelp/references/csawlib/com/adobe/photoshop/ExportOptionsSaveForWeb.html)から探してみると、どうも`quality`がそれっぽい。
でも、それってjpgとかで使用するやつなんだろうなぁと思って、半信半疑で設定してみると【劣化】に値が設定された。

ちなみに、【劣化】の値は0に近いほど画像が綺麗に書き出されるので、`quality`は0に設定する必要がある。
最終的には以下のように設定した。

```js
var option = new ExportOptionsSaveForWeb(); //「WEB用 に保存」の設定
option .format = SaveDocumentType.COMPUSERVEGIF; //ファイル形式を「gif」に設定
option.quality = 0;

//「WEB用 に保存」を実行
activeDocument.exportDocument('ファイル名', ExportType.SAVEFORWEB, option);
```
05.PerformanceWaterfall - High Performance Web 2015

# パフォーマンス・ウォーターフォール

SpeedIndex は算出する指標だったが、ここでは実測の指標を見て行く。

## watagall view

これは WebPageTest というサービスでとった自分のサイトの測定結果。

https://jxck.io

![webpagetest.png](https://qiita-image-store.s3.amazonaws.com/0/6452/1656f19a-5e5b-f734-d85c-57cd5c907611.png)

シンプルなページなので結果もシンプルだ。

## metrics

- DNS Lookup
- Initial Connection
- SSL Negotiation
- Time to First Byte
- Content Download
- Start Render
- msFirstPaint
- DOM Content Loaded
- On Load
- Document Complete

この辺のポイントまでとれれば現状十分かと思われる。

この場合、ばっと見ても TTFB(Time To First Byte) と SSL Negotiation が支配的に見える。

ちなみに図中上の表には SpeedIndex も出ている。

## DNS Lookup / initial connect / SSL Negotiation

DNS の解決は、ホストの名前解決だ。解決結果がキャッシュされてればいいが、されてなければ必須となる。

initial connect は TCP の接続確立で、要するに 3 way handshake。

SSL Negotiation は、 HTTPS ページでの TLS セッション確立。

これだけでもそれなりに RTT があるため、無視は一切できない。

## TTFB (time to first byte)

ブラウザはサーバに接続し、リクエストを投げて、レスポンスを受け取る。
TTFB は、そのレスポンスの最初のパケットを受け取った時間を現す。

つまり、サーバ内で解決する Response Time に、双方間でのネットワークが消費する時間が加えられたものになる。

つまり、クライアントから見た「*サービスの速さ*」は実際にはこっちの方がリアルに現されていると言えそうだ。どんなユーザもネットワーク環境が良好なところにいるとは限らないという点が加味できる。


## Start Render / First Paint

コンテンツとして HTML を取得すれば、それを解析し DOM を構築し、必要なサブリソースを取ったりなんかして、画面に表示を始める。

解析を始めた瞬間が Start Rendering で、その結果画面に絵を表示し始める瞬間がこの First Paint になる。

例えば Start Rendering と First Paint の間に時間が空いたようであれば、レンダリングプロセスの途中、サブリソースの取得などでレンダリングがストップする問題などが見つかる。

SpeedIndex を向上するためには、 First Paint はなるべく速い方が良いという視点に立てば、このレンダリングがスムーズにペイントを始められるようなチューニングも見えてくるなど。

## onload / DOMContentLoaded

[DOMContentLoaded](https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded) は、ここに書かれている通り、HTML の取得と解析が終わった時点で発火する。

その後 HTML に付随する全てのサブリソースが取得されて、そのページを構成する全てが取得された時点で発火するのが onload となる。

つまり、 DOMContentLoaded の遅延がある場合、 HTML の解析をブロックする何かがある可能性を示唆し、DOMContentLoaded と onload の間にある時間は、サブリソースの取得でもたついている可能性を示唆する。

これは JS 書く時にどっちを取るかという話でもよく使われるが、実際にはブラウザの中で何がどこまで進んでいるのかを知るという意味で、結構重要な指標だったりする。
すごいE本をElixirでやる(4章)

[2015/06/23/すごいE本をElixirでやる(10) - ヽ（´・肉・｀）ノログ](http://niku.name/articles/2015/06/23/%E3%81%99%E3%81%94%E3%81%84E%E6%9C%AC%E3%82%92Elixir%E3%81%A7%E3%82%84%E3%82%8B(10)) より

# 4.1 動的で強い型付け

> たいていの言語や型システムはプログラムからエラーを取り除くことを目標としている一方で、
> Erlang は、エラーはどうせ起きるのだからエラーから確実に回復するようにしようという戦略に立っているということです。

Elixir は素直に ErlangVM を利用しているので，Erlang と同じ戦略，堅牢さを利用できる．

「念のため，未知のことに対応させる」ようなコードは書かなくてよい．

```elixir
6 + "1"
#>  ** (ArithmeticError) bad argument in arithmetic expression
#>     orgmode_elixir_src.exs:1: (file)
#>     (elixir) lib/code.ex:307: Code.require_file/2
```

# 4.2 型変換

```elixir
String.to_integer("54")  # => 54
Integer.to_string(54)    # => 54
String.to_integer("54.32")
#> ** (ArgumentError) argument error
#>     orgmode_elixir_src.exs:3: (file)
#>     (elixir) lib/code.ex:307: Code.require_file/2
String.to_float("54.32") # => 54.32
Atom.to_string(true)     # => :true
String.to_char_list("hi there") # => 'hi there'
List.to_string('hi there')      # => "hi there"
```

見てわかるように Elixir の場合 `変換元の型` がモジュール名， `to_変換先の型` が関数で用意されていることが多い．

# 4.3 データ型を守るために

Elixir でも `is_` で型を分けることができる．

```elixir
defmodule X do
  def my_function(exp) when is_binary(exp), do: "expression1"
  def my_function(exp) when is_list(exp), do: "expression2"
end

X.my_function("binary")    # => expression1
X.my_function('char list') # => expression2
```

# 4.4 型ジャンキーのために

Elixir からも静的型解析を行うツール Dialyzer を利用することができる．

以前 [静的型チェックツールDialyzerをElixirから使う - Qiita](http://qiita.com/niku/items/826f3c39c2b8bd99eb5a) に調べたことを書いた．
Ubuntu14.04にrbenvでRuby2.2.2をインストール

Ubuntu14.04にrbenvからRuby2.2.2をインストールした際の作業メモです。

```bash
#これやらないとruby-buildのインストールに失敗する
$sudo apt-get update                  
#rbenvとgit、OpenSSLをインストール
$sudo apt-get install -y git rbenv libssl-dev    

# .bashrcに以下を追記してrbenvのパスを通す
$vi .bashrc                           
# export PATH="$HOME/.rbenv/bin:$PATH"
# eval "$(rbenv init -)"
$source .bashrc                       

#ruby-buildリポジトリを取得し、.rbenv/plugins配下に展開
$git clone https://github.com/sstephenson/ruby-build.git ~/.rbenv/plugins/ruby-build    
#rbenvでruby2.2.2をインストール
$rbenv install 2.2.2                  
#rubyバージョン2.2.2を使用
$rbenv global 2.2.2                   
#2.2.2と出力されれば成功
$ruby -v                 
```

参考) http://qiita.com/kazoo04/items/7056704efee66f323ddb
初心者がOAuthを利用して「Facebookでログイン」機能を作る

はい、やっていきます。
失敗した所をピックアップして書いていきます。
パーフェクトRubyOnRailsをやっている方は、なぜ例題が違うのか？と気になるかと思いますが、TwitterのCreate an applicationがどうやっても通らないので苦肉の策になった次第です。（未だにiPhone４Sなのがいけないのかもしれません。）

1）指定されたURLは、アプリケーションの設定で許可されていません。: 指定されたURLの中にアプリの設定で認められないものが含まれています。ウェブサイトまたはキャンバスのURLと一致しているか、ドメインがアプリのドメインのサブドメインである必要があります。

はい、ここです。Facebookで登録したappのURLにリンクで飛ぶと起こるエラーですが、検索しても今一良くわかりませんでした。
https://developers.facebook.com
のMyAppsのsettingsにある、以下
・Site URL　（http://localhost:3000/）
・Mobile Site URL　（http://localhost:3000/）
（（）内を記入。確認時はここだけで大丈夫でした。）

いろいろ記入を変えながらやっても駄目だったのですが、結局原因はこれでした。
「http://0.0.0.0:3000」
rails s　コマンドで上をコピペしてやってたんですが、
http://localhost:3000/としたところすんなりいけました・・・。登録したURLとブラウザのURLを合わせる事が大事だったようです。

２）Auth Hash
教科書と違う状況なのでここでエラーが出てしまったのですが、
https://github.com/mkdynamic/omniauth-facebook
上を参考に欲しい情報を指定して受け取るようにするとできました。
激速！IMEのショートカット

#激速！IMEのショートカット

IMEはWindows標準で入っていいて皆さんもご存じだと思います。しかし、キータッチが速い人でもホームポジションから指が離れがちになってしまいます。ほら指が離れると意識も集中力も途切れがち。
だれでもミスタッチはあります。でもＢＳキーは以外に遠い場所に存在します。
とりあえず、これを試してみましょう。

| キー | 内容 |
|:-----------|:------------|
| CTRL+H | 左１文字削除（BS） |

さくさく、訂正できますね。これ便利。
次に、覚えるのはこれ。

| キー | 内容 |
|:-----------|:------------|
| CTRL+M | 確定(ENTER) |

ぱしぱし力を入れてENTERキーを押している方、「俺はキー入力早いんだぜ・・・」とか自信があるもかもしれないですが、腱鞘炎になっちゃうよ。そんなに力を入れてやらなくても、「スッ」っで確定出来てしまうのだ。
これを覚えるとホームポジションから指が離れなくなります。

さらに覚えると便利なキー
なれるとファンクションキーが遠く感じますよ

| キー | 内容 |
|:-----------|:------------|
| CTRL+U | ひらがな(F6) |
| CTRL+I | 全角カタカナ(F7) |
| CTRL+O | 半角英数(F8) |
| CTRL+P | 全角英数(F9) | 

ここで、CTRL押すの面倒だなーと思ったあなた！デスクトップなら以下の操作ができると超ベリー良いです。

* 左手小指の付け根でCTRLを押す。

![ime.jpg](https://qiita-image-store.s3.amazonaws.com/0/69810/ab7e5430-1309-47fa-bdb3-c241d4d63bf4.jpeg)

今まで紹介したキーが右手のキーってことろがミソです。
これをマスターすればキータッチの達人です。:-)
Railsアンチパターン<コントローラー編>④,⑤,⑥,⑦Resourceとは

RailsはRESTの哲学に基づいているのでそれを守ろうという話。だいたい関連していたので三つのパターンをまとめた。長い……

アンチパターン:Monolicic Controller
=
RESTfulではないと、たとえばこんなことが起こってくる。

 - resourceではなく、actionを指定するようなパラメータ
 - 独自のaction(index,new,create,edit,update,show,destroy以外のやつ)

```.rb
def users
  per_page = Variable::default_pagination_value 
  @users = User.find(:all)
  # First, check to see if there
  # was an operation performed
  if not params[:operation].nil? then
  if (params[:operation] == "reset_password") then 
    user = User.find(params[:id]) user.generate_password_reset_access_key 
    user.password_confirmation =   user.password 
    user.email_confirmation = user.email  
    user.save!
    flash[:notice] = user.first_name + " " + user.last_name + "'s password has been reset."
end
```
の例。 `params[:operation]`というのが怪しいと。このまま方針進んでいくとさらに`param[:operation]`で条件分岐しまくってカオスになってくる未来が見える。
RESTfulなアプリケーションは動詞はHTTP requestメソッドで、対象をurlで指定する。urlで「何を」行うか指定するのはSOAPのやり方でRESTではない。

勘違いされやすいのだけど、RESTfulなリソースにするということとモデルを用意するということはイコールではない。あるものが操作可能であると捉えて、それをurlで指定できれば実際のモデルが存在していなくてもそれはRESTful resource足り得る。

たとえばuserが持つpasswowdカラムをRESTfulなリソースと捉えて、コントローラーを定義してみる。

```.rb
class PasswordsController < ApplicationController 
  def create
    user = User.find(params[:id]) 
    user.generate_password_reset_access_key 
    user.password_confirmation = user.password 
    user.email_confirmation = user.email 
    user.save!
    flash[:notice] = user.first_name + " " + user.last_name + "'s password has been reset."
 end 
end

```
もともとの悪い例ではこのpasswordの操作もUserControllerの一部であったが、リソースとして分離することでControllerを分割できた。
あらゆる操作を内包したコントローラーは次第に大きくなり、細かい条件分岐をするために謎パラメータが増えていく。そうなる前に適切にリソースを切り分けよう。という話だった。

##結論:RESTfulなリソースとして扱うこととモデルを用意することは等価ではない。現状コントローラーで行っている処理対象を別リソースとして切り分けれないかどうか考えてみよう。
SRPの法則はControllerにも適用できる。というか適用しよう。

アンチパターン:Lost child controller
=
ある親子関連の適当なテーブルがあったとして、毎回、

```.rb
(この例ではalbu has_many songs、という関連になっている)
class SongsController < ApplicationController 
  def new
    @song = Song.new(:album_id => params[:album_id])
    #...
```
などとやるのは、よろしくない。Railsの機能でResourceはネストできるのでそれを使おう。

ソリューション:resouceのネストを利用する。またネストしたか、していないかの文脈でContorollerを分ける。
=

```.rb
MyApp::Application.routes.draw do resources :albums do
resources :songs end
```
これにより、便利な

```.rb
GET /albums/:album_id/songs(.:format)
POST /albums/:album_id/songs(.:format)
GET /albums/:album_id/songs/new(.:format)
……
```
などのルーティングが提供される。

また、同じモデルが対象でも、ネストした場合とそうでないリソースについてはControllerを分けたほうがいいときがある。
この例なら、

```
controllers/messages_controller.rb 
controllers/users/messages_controller.rb
```
というようにネストに合わせてサブディレクトリを切って、Contorollerを分ける。文脈によって行われるアクション(の動作)は異なってくるのだから多少DRYさを犠牲にしても、こうしたほうがいい場合もある。

##結論:適切な粒度でコントローラーを分割しよう。DRYにこだわりすぎず、簡潔にかけることを重視したほうがいいときもある。

##所感
RESTFulについて熱く語られてて、以前よりこの言葉について実感がわいた気がする。また、contorollers内にサブディレクトリを切るという発想は斬新だった。
ところでrailsがこの哲学を強要していることについては昔からかなりいろいろ議論があって、いろいろ調べてみると使いやすいようにいろいろ試してみたり、あるいは新しい機能があったり面白い。
http://qiita.com/kuboon/items/96bbd227f9497ed81f38
http://qiita.com/r7kamura/items/dea3c58b6fc81142a363
この辺りについても読んだ上で、柔軟にアプリケーション構成を考えられるようになればいいなと思う。
04.SpeedIndex - High Performance Web 2015

# SpeedIndex

指標の一つ、 SpeedIndex について。

ドキュメントとしてはここに書かれてる。というのもあって、出典は Google と認識している。

https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index


## 要するに

こういう違いを

![filmscript](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index/compare_progress.png?attredirects=0)

こうやって数値化する

![high speedindex](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index/chart-index-a-small.png?attredirects=0)
![low speedindex](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index/chart-index-b-small.png?attredirects=0)

式はこう。

![logic](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index/speedindexformula.png?attredirects=0)

つまり、小さければ小さいほどよいことがわかる。
(最初の 1ms で 100% になれば、スコアは 0)


画像はっただけだが、説明いらなくて困る。
これによって、同じ表示時間でも、体感として「表示された感」に近いものを現せていると見てもまあ良さそうだろう。

Response Time が同じでも、 SpeedIndex の値が悪ければ、せっかくのチューニングがフロントでだいなしになっている事が数値でわかる訳である。

## 測り方

式を見ると、 **1ms ごとに完了率を出して加算** ということだが、この完了率はどうだすかという問題がある。

G 様曰く方式は二つ

- ビデオとってピクセル数える
- Paint Event を取る

まあ、そうだろう。ただこれを自分でやる訳じゃない。ツールを使う。
ツールが出てきたからこそ、この指標が注目されているという意味でもある。
(自分で測定したい人は、前述のドキュメント読んで頑張ってほしい)

## 測定方法

最近のツールでは割とはかれるようになってきている。
よって、最近のツール紹介でまとめてやる。
03.Metrics - High Performance Web 2015

# 何を測るか

Response Time が全体の半分しか測れていないとするなら、何を測れば良いのか。
もちろん、「速いかどうか」が知りたいわけなので、 **何をもって速いか** が先立つ必要がある。

## Response Time が測っていたもの

Response Time はそもそも、「サーバがレスポンスを速く返せば速い」という前提で、「そこにどの位時間がかかってるか」を測っていた。わかりやすい。


## 表示が速い

ブラウザがページを表示して初めてユーザのターンになる Web の場合、
この「表示が速い」ことを一つの指標にできるかもしれない。

もし仮にサーバ側をカリッカリにチューニングしても、「表示が遅い」と感じたら台無しだからだ。
Response Time の裏に消えた何かがここに隠れている気がする。これは測るに値しそうだ。


## 表示の時間と速さ

以下は filmstrip という時系列画像。[^1]

[^1]: https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index

![compare_trimmed.png](https://qiita-image-store.s3.amazonaws.com/0/6452/c8ceec68-f426-82b0-c105-2f204505ac25.png)

もしこの上下が全く同じ Response Time だったとしても、実際にこのページを表示した場合、ユーザが感じる **速さ** は本当に同じかというと、そんなことは無いと思う。

もう一つ画像を引用する。 [^2]

![above the fold.png](https://qiita-image-store.s3.amazonaws.com/0/6452/9738f1e6-a96b-21f7-2375-72fd78620a47.png)


[^2]: https://onedrive.live.com/view.aspx?resid=A115415BEE319427!1232607&ithint=file,pptx&app=PowerPoint&authkey=!AJWDn7UlNx8zMTM


レスポンスには基本全ての情報が入っている。
ということは、表示した瞬間人間に見えているところ、隠れているところも関係なく入っている。

実際人間が最初に見る部分を Above the Fold 、そうでない部分を Below the Fold という。

全体を均等に表示するよりは、 Above the Fold を優先した方が速いと思えるだろう。


## 「速い」と思えれば速い？

結局見ているのは人間なので、その人間が **速い** と感じることができなければ、それっぽい数字を持ち出したところで意味が無くなってしまう。
究極的には「**速いと思うか**」どうがだと思う、それはもう覆りようが無い。

これを知る一番簡単なのはユーザテストだ、毎回試してもらって「速いと思う？」とか、二つ用意して「どっちが速い？」って聞いてまわればいい。

それも有効だが、すべてそれをまかなうのは現実的じゃない。
そこで、「**人間が速いと思うかどうか**」をなるべくがんばって数値化する必要がある。
その指標は、観点によって色々有る。とくに最近増えてる気がする。
研究が進んでる証拠だと思う。


## 速さの指標

色々ある。大小やカテゴライズは無視してとりあえずざっと思いついたものを上げる。

- Time To First Byte
- FirstPaint
- DomContentLoaded
- onload
- SpeedIndex
- content size
- response time
- RAIL

この辺も個々に書いていく予定。
Mac OS Xでmonoを使ってC#のプログラムをコンパイルする


# モチベーション
「monoを使うと、MacでもC#を使えるらしい」というふんわりした理解です。
どれほどのものなのか試して知りたい。

# 要するに
hello worldを動かしました。

# 手順

## インストール mono

```
brew install mono
```

## ソースコード

```csharp:hello_world.cs
using System;

class HelloWorld {
    public static void Main( )
    {
        Console.WriteLine("hello world");
    }
}
```

## コンパイル

```
mcs hello_world.cs
```

## 実行

```
mono hello_world.exe
```

## 実行結果
```
hello world
```

# 感想

atom が C# をサポートしていて驚きました。

# 参考リンク

- [[C#]Windowsで書いたソリューションをMacでビルドしたメモ - Qiita](http://qiita.com/NumAniCloud/items/debad1bb5d3262ed035a)
- [Mono Basics | Mono](http://www.mono-project.com/docs/getting-started/mono-basics/)
Rails4.2 でActiveJob & ActionMailerをそのプロセスでだけ一時的に止める

# 導入 ( ぼくのRails開発環境事情 )

「ユーザー登録時にwelcomeメールを送る」みたいな機能があると、
ユーザーを生成するたびにメール送信処理が走ります。

```rb:app/models/user.rb
class User
  after_create :send_welcome

  ...

  private

  def send_welcome
    UserMailer.welcome(self).delivey_later # => ActiveJobが非同期にメールを送ってくれる
  end
end
```

```rb:rails-console
User.create!(...) # => Welcome メールが飛ぶ！
```

開発環境では、`letter_opener` を使っているので、実際にメールサーバーを叩いたりはしないようになっています。

```rb:Gemfile
gem 'letter_opener'
```
```rb:config/environments/development.rb
Rails.application.configure do
  ...
  # letter opener
  config.action_mailer.delivery_method = :letter_opener
  ...
end
```

が、代わりにブラウザに新しいタブが開くわけです。

```rb:rails-console
User.create!(...) # => ブラウザに新しいタブが開く
```

# 問題

そんな時、まとめてユーザーを1000人作ったりすると一斉にメールが開きます。

```rb:rails-console
1000.times { User.create!(...) } # => ブラウザに新しいタブが1000個開く
```

ブラウザに1000個タブが一気に開いたら普通に考えてメモリ食いつぶして死にます。
何とかしなければ。


# 解決方法

で、端的に解決方法。

```rb
ActionMailer::Base.perform_deliveries = false
ActiveJob::Base.queue_adapter = :inline

1000.times { User.create!(...) } # => メールが飛ばないやったー！
```

# かいせつ

最初は`ActionMailer::Base.perform_deliveries = false`だけでいけるかと思ったのですがダメでした。

なんでかというと、バックグラウンドジョブ自体は、別プロセスで動いているので...

```shell-session
$ bin/rails c # => プロセス1

$ bin/rake jobs:work # => プロセス2
```

`.deliver_later`してしまうと、そちらに処理が飛ばされてしまい、ローカルで上書きした設定は反映されないのです。
(deliver_layerはActiveJobとActionMailerの連携したメソッドです)

なんとかして同じプロセス上でActiveJobが走らせればいいわけで、
それが`ActiveJob::Base.queue_adapter = :inline`になります。

`ActiveJob::QueueAdapters::InlineAdapter`は、そのプロセスで即時実行するキュー戦略なので、その場で処理が起動して、めでたく、上書きした設定で処理を進めてくれます。




書いてから思ったけど、完全に自分の環境依存の問題な気がした。
SpheroをGo言語から制御して遊んでみた


最近Golangを勉強しています。

前に、こちらの記事([Node.jsで操作できるロボティックボールSpheroでHello World](http://qiita.com/n0bisuke/items/5d1f3e5328449e951258))でCyloy.jsを使ってみました。

Cylon.jsはIoT向けのNode.jsフレームワーク(サイトにはフレームワークって書いてありますがライブラリでいいと思う)です。その姉妹的なプロジェクトでGo言語向けのGobotがあります。

最近Go勉強しているのでGobotも使ってみました。


## Gobot

GobotはCylon.jsの姉妹プロジェクト
![](http://i.gyazo.com/53bdbfd88e7d72f69c65f5f0093b983a.png)

サイトはこちら。http://gobot.io/

```
$ go get github.com/hybridgroup/gobot
```
とりあえずこれで使えるようになります。

## Spheroも操作できます。

http://gobot.io/documentation/platforms/sphero/

http://godoc.org/github.com/hybridgroup/gobot/platforms/sphero#SpheroAdaptor

### サンプルを試してみる

まずはこちらの記事([Node.jsで操作できるロボティックボールSpheroでHello World](http://qiita.com/n0bisuke/items/5d1f3e5328449e951258))を参考にポート情報を確認しましょう。

私のspheroポートは`/dev/tty.Sphero-RRY-AMP-SPP`でした。


```
$ go get github.com/hybridgroup/gobot/platforms/sphero
```

サンプルコードを元に実行してみましょう。
[サイト上](http://gobot.io/documentation/platforms/sphero/)だと`fmt`パッケージも読み込んでますが、不要なので記述から削除してあります。

```sphero.go
package main

import (
	"time"

	"github.com/hybridgroup/gobot"
	"github.com/hybridgroup/gobot/platforms/sphero"
)

func main() {
	gbot := gobot.NewGobot()

	adaptor := sphero.NewSpheroAdaptor("sphero", "/dev/tty.Sphero-RRY-AMP-SPP") // ポートを自分の環境にあわせる
	driver := sphero.NewSpheroDriver(adaptor, "sphero")

	work := func() {
		gobot.Every(3*time.Second, func() {
			driver.Roll(30, uint16(gobot.Rand(360)))
		})
	}

	robot := gobot.NewRobot("sphero",
		[]gobot.Connection{adaptor},
		[]gobot.Device{driver},
		work,
	)

	gbot.AddRobot(robot)

	gbot.Start()
}
```

実行します。

```
$ go run sphero.go
2015/06/23 04:18:44 Initializing Robot sphero ...
2015/06/23 04:18:44 Initializing connections...
2015/06/23 04:18:44 Initializing connection sphero ...
2015/06/23 04:18:44 Initializing devices...
2015/06/23 04:18:44 Initializing device sphero ...
2015/06/23 04:18:44 Starting Robot sphero ...
2015/06/23 04:18:44 Starting connections...
2015/06/23 04:18:44 Starting connection sphero on port /dev/tty.Sphero-RRY-AMP-SPP...
2015/06/23 04:18:47 Starting devices...
2015/06/23 04:18:47 Starting device sphero...
2015/06/23 04:18:47 Starting work...

```

こんな感じで表示されて、spheroがコロコロ動き出すと思います。

![](http://i.gyazo.com/7bbce8e1d4d69d4fd2f9f64de5a70a2b.gif)


## LEDの色変えたりも

sphero.go

```sphero.go
/*省略*/
  work := func() {
	gobot.Every(3*time.Second, func() {
      r := uint8(gobot.Rand(255))
      g := uint8(gobot.Rand(255))
      b := uint8(gobot.Rand(255))
      driver.SetRGB(r,g,b)
      fmt.Println(r,g,b)
	})
  }
/*省略*/
```

![](http://i.gyazo.com/6e040752e2502f1b686e148b295e337a.gif)


##まとめ

もっと色々やりたかったけど、眠くなったからやめておきます。

Cylon.jsよりもGobotの方がspheroに関しては実装されてるメソッドが多いかもなぁという印象です。

また色々と触ってみよう。
【Swift】長文を表示するUITextViewがスクロールされた状態の時

いろいろ調べたけどなかなか動かなかったのでメモ。
文章量によってずれる位置が変わると思うので、-100ってところを調整。

```swift:UIViewController.swift
    @IBOutlet weak var txt_LongLongText: UITextView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        txt_LongLongText.setContentOffset(CGPointMake(0, -100), animated: false)
    }
```

UITextView　上寄せ　とか
UITextView　スクロールされてる　とかで調べたんですが、試してもうまくいかなかったです。
結局UIScrollView関連で調べて上記の関数でセットしてたのでそれで対応済みとします。
コーディングに適したフォント「Source Han Code JPフォント」のインストール方法

最近話題のコーテイングに適していると言われているフォント  
「Source Han Code JP(源の角ゴシック Code JP)」のインストール方法です。
# 事前準備
`brew cask`が必要になるのでインストールします。([`brew cask`とはなんぞやって人はこちら](http://qiita.com/ryurock/items/1432578d364985f6cb06 "brew caskとはなんぞやって人はこちら"))
`$ brew install caskroom/cask/brew-cask`

念の為に必要なものを最新版にアップデートも行っておく。僕は最新版にアップデートしていなかったためエラーがおきました。
brewのアップデート
`$ brew update`
brew updateでエラーが起きた場合は[こちら](http://qiita.com/harapeko_wktk/items/f4f44ddb5d3912e15ea2,"こちら")
gemのアップデート
`$ gem update --system`

#　いよいよフォントのインストール
<pre>$ brew tap caskroom/fonts
$ brew cask install font-source-han-code-jp</pre>

終了！
あとはそれぞれが使用しているテキストエディタの設定でフォントを指定すれば使用できます！


# おまけ
+ github https://github.com/adobe-fonts/source-han-code-jp

+ コーディングに最適な日本語対応の等幅フォントSource Han Code JPとは   http://ics-web.jp/lab/archives/7010
02.Target - High Performance Web 2015

# 何をもって速いとするか

これを書くきっかけの一つでもあるので、まずは前提の話をする。

この前提がはっきりしないとパフォーマンスの話はできない。
しかし、今の Web ではこれこそが一番難しいんだと思う。

## 推測するな測定せよ -> 何を？？

ロブ先生の引用については説明しないが、パフォーマンスには測定が不可欠だ。

Web のパフォーマンスという意味で、真っ先に測られるものの一つに **Response Time** があったと思う。

Web での Response Time とは、リクエストがサーバに届き、サーバがそれを処理してレスポンスをクライアントに返すのにかかる時間。
つまりサーバが消費する時間という形で測られて、だからサーバのログに残せる。


## なぜ Response Time を測ったか

サーバがレスポンスを作るのにかかる時間と、そのレスポンスをブラウザに送り出した後で比べれば、
前者の方が支配的な時間を使っていたからというのが有ると思う。
チューニングは必ずボトルネックから始まる。

多くの場合は、サーバ内で発生する File や DB や 別サービスへの I/O にかかる時間が支配的だった。

相対的に、ブラウザがそれを表示するのにかかる時間は無視されていた。
それを届けるための間にあるネットワークのチューニングも、そこまで問題視されなかった。

また、 Response Time は **測りやすい** という性質もある。サーバの設定を少しいじれば、 Access Log に入れるのもそんな大変じゃなかった。

でも、それはもう昔話だと思う。


## Response Time で足りるのか

Response Time がチューニングで速くなれば、多くの場合「速くなった」と体感できるだろう。
そして、このチューニングはある意味かなり成熟してきていると思う。

成熟というのは、簡単という意味ではないし、だれでもできるという意味でもない。
過去の ISUCON なども、まさしくここを大きな指標として戦っていた。
つまり、競技にできるくらいスキルが必要だ、軽視してはもちろんいけない。

### Response Time は簡単に台無しにできる

ただし、例えばそれがたくさんの画像を表示するポータルサイトだったり、
最初の表示から刻々と変化するもの、 SPA 的なものだった場合、
フロントの作りによっては、 Response Time の成果をいとも簡単に台無しにできる場合がある。
どんなにバックエンド側をチューニングしても、表示部分も適切に作られていないと、その成果は活かせない。

### Response Time の改善にも限界がある

Response Time でできることは、リクエストがサーバに入ってレスポンスが出てくるまでだすると、
逆を言えば、それ以外は全てこの数値に反映されない。

つまり、この数値だけを拠り所にしていると、この数値が最適化の限界が、全体の限界を意味する。
しかし、すでにここ以外にも、チューニングが可能な場所がたくさんあることがわかっている。


## Response Time = 全体の半分

対象を「クライアントとサーバのインタラクション」だとすると、
サーバが消費する時間以外にも、クライアントが消費する時間や、両者間での転送時間もある。

そしてそれは年々無視できない重要性を帯びている。

平たく言えば、 Response Time で測れているのは、全体の半分程度にすぎない。

## あと何を測ればいいのか？

実はこれが、長いこと抜けていたミッシングピースであり、最近やっと出てき始めてきたという体感。

具体的には以下を考える必要がある。

- 測るべき指標
- それを数値化する手段
- それを取得するツール
- それを最適化するノウハウ

そして、例えば High Performance Web Site あたりから徐々に出てきているが、
時間とともにそのピースも形を変えている。

個人的にはこの辺は出てきたばかりで、先ほど言った意味での「成熟」とはほど遠いと思う。
でも、実際はあるものを使ってやっていくしか無い。その結果成熟させていくしかない。


次はまず、その指標と数値化あたりを書きたい。
Railsアンチパターン<コントローラー編>③Cookieにいろいろ入れすぎ問題

cookieにオブジェクトデータを入れまくるのはやめようという話。例としてはamazonのカートに入れた商品データを全部cookieにそのまま突っ込むというのが揚げられている。
Railsで扱えるcookieの容量は4kb。なんだけど普通こんなに使うことはないので、容量オーバーでバグったらそもそもの設計から見直そう。


ソリューション:インスタンスの代わりに参照を保持しよう。
=
例では、たとえばこういうことをしている

```.rb
# @ in controller
def new
  session[:order] = Order.new
end

def create
  if session[:order].save
    #...
end


def billing
  session[:order].attributes = params[:order]
  #...
end

def shipping
  session[:order].attributes = params[:order]
  #..

#...
```
このようにcookieをdata storeとして使うのは本来の使い道ではない。やめよう。
やり方は二つあって、　

- Database内のobjectに状態を持たせる(カラムを追加する)
- 毎回resuqestごとに新しくインスタンスを作る(`from.hidden_field`を利用して今までの情報も同時に送る)

後者のクライアント側に情報を持たせる方法はあんまり数多くのステップを踏まないようなフローや、DB内に不完全なレコードを置きたくない場合に適切。複雑なフローの場合には前者を利用すると良いだろう。


結論:状態を管理するのにもcookie以外にもいろいろやり方はある。適切な方法を探そう。
sshで攻撃されやすいユーザー名ランキング50

# sshで攻撃されやすいユーザー名ランキング50

最近、私のサーバーにログインを試みたユーザー名のランキングです。
ちょっと偏りがあるかもしれないです。

## ランキング作成シェルスクリプト

動作確認はCentOS6.5 でしています。

```bash
# 最後にあるlessを 'head -n 50'  に変更すれば、ランキング50が出力できる。
# secureはrootじゃないと読めないから気をつけて！
grep Invalid /var/log/secure* | cut -f 8 -d " " | sort | uniq -c | sort -nr | less
```

## 攻撃されたユーザー名ランキング50(2015/06/23採取)

```
# アクセス数 : ユーザー名
11655 user
3812 admin
2046 test
1757 guest
1000 ubnt
 922 nagios
 677 pi
 506 oracle
 498 zabbix
 471 ftpuser
 453 xbian
 429 PlcmSpIp
 418 support
 388 kadmin
 371 default
 296 www-data
 291 aaron
 288 ubuntu
 277 D-Link
 270 postgres
 190 zxin10
 173 tomcat
 166 web
 144 jboss
 143 student
 140 sysadmin
 135 vnc
 129 backup
 121 cisco
 119 mysql
 115 weblogic
 115 vyatta
 115 alex
 111 test2
 111 sales
 111 git
 109 apache
 108 zhaowei
 108 webadmin
 105 library
  97 fluffy
  92 cacti
  82 shoutcast
  82 Test
  81 info
  79 teamspeak
  78 httpd
  76 www
  76 hadoop
  73 minecraft
```

## 攻撃されたユーザー名ランキング50 その２(2016/06/27採取)
```
# アクセス数:ユーザー数
    634 admin
    560 jp-eastpute
    560 idcfcloud
    560 eastpute
    560 210-140-96-53
    409 oracle
    318 test
    288 nagios
    287 teamspeak
    240 postgres
    233 minecraft
    214 zabbix
    183 ts
    180 teamspeak3
    172 ts3
    162 ftpuser
    153 user
    153 tomcat
    140 ubuntu
    133 hadoop
    131 deploy
    129 ubnt
    128 guest
    126 redmine
    119 webadmin
    114 mysql
    108 support
    106 jenkins
     99 jboss
     97 info
     97 alex
     95 apache
     92 www-data
     91 www
     89 pi
     81 developer
     79 backup
     73 wordpress
     70 svn
     67 weblogic
     66 db2inst1
     65 vnc
     64 tom
     63 cacti
     58 dev
     57 steam
     57 david
     57 PlcmSpIp
     56 sybase
     56 centos
```

### 感想

Webサーバーとして公開しているわけではなく、GitLab等で個人的に利用しているにも関わらず攻撃が多すぎてびっくり。
ユーザー名をピタリと当ててくる攻撃はなかったので一安心。
鍵認証しか許可してないので、特に怖がる必要もないけども。
良い子はsshのパスワード認証を無効化して、鍵認証のみにしようね！

### 追記 2016/06/27

2016/06/27 久しぶりに採取してみました。諸事情により、前回と同じサーバーではなく新しく立てたサーバーです。idcf cloudです。ユーザー名で当ててきてびっくり。サーバー上にそのユーザーは存在しないので脅威ではないけれどね。
IPでもランキングとってみると、韓国からの攻撃がほとんどだった。
今のところ、このサーバーはprivate gitlab専用なので、日本以外を弾く設定にすれば相当数の攻撃を防げそうな気がする。
01.Intro - High Performance Web 2015

# Web のパフォーマンスの今

自分の持っている Web のパフォーマンスに関する知識を、一旦全部吐き出してまとめたいと思っていたので、それをやってみようと思う。

# 予定

この辺が頭にはある。

- Metrics
- TCP
- TLS
- Rendering
- Prebrowsing
- Async/Defer
- Cache
- Priority
- HTTP2
- QUIC

とりえず、思いついた順に書いて後で整理する。

# スタンス

まずは知識のダンプを目的としたい。

デモとか実際の計測細かく作ると時間がかかるので、まず書くだけ書いて、やるとしても後でやる。

あといつも、自分で書き溜めて、見直して、書き直して、、、とやっていて気がつくと飽きて出さずに終わることが結構多いので、
今回はとにかく出して、追記や修正は後からがんがん更新していく感じにしたい。

更新履歴は Qiita で勝手に残るので、そこに任せる。


# 書いたものリスト

ここに追加して行く。追加した時に変更通知を送るので、興味がある人はここをストックしておくと通知が行くはず。

1. [Intro](http://qiita.com/Jxck_/items/3bd89c60ff90af7e0b95)
1. [Target](http://qiita.com/Jxck_/items/b291aeb4c6d99457739a)
1. [Metrics](http://qiita.com/Jxck_/items/b92fade1bcb79a8c0b32)
1. [SpeedIndex](http://qiita.com/Jxck_/items/03c257fe984d3efe5541)
1. [PerformanceWaterfall](http://qiita.com/Jxck_/items/5b8250f7164b597df0d3)
1. [DNS Prefetch](http://qiita.com/Jxck_/items/2716d17f683fd3d2148a)
1. [Preconnect](http://qiita.com/Jxck_/items/b89e9635d927e4242aa2)
1. [Prefetch](http://qiita.com/Jxck_/items/5c6f60ab52086c25e1cf)
1. [Prerender](http://qiita.com/Jxck_/items/71929a11dd7ddac0e22e)
1. [TCP Fast Open](http://qiita.com/Jxck_/items/3cae887c50fdba814fe4)
1. [Initial Congestion Window](http://qiita.com/Jxck_/items/741eb1b48c6fa13d81ef)
1. [Optimise HTML](http://qiita.com/Jxck_/items/2573f80bb3c7df8ca48f) 
1. [Head of Line Blocking](http://qiita.com/Jxck_/items/0dbdee585db3e21639a8)
1. [Browser Cache](http://qiita.com/Jxck_/items/ccf6d6dd7b12f32c40be)
Go言語でAmazon Linux AMI向けのビルド


自分用メモです〜

## 通常ビルドとデプロイ

Macでビルドしたものをscpコマンドで転送してサーバー上で実行しても

```Mac
$ go build hello.go
```

これでhello.goから`hello`という実行形式ファイルが生成されます。

```Mac
$ ls
hello.go hello
```

とりあえずMacで実行は出来ます。

```Mac
$ ./hello
hello go!!
```

サーバー(EC2)に転送します。
EC2側はAmazonLinuxAMIです。

```Mac
$ scp -i ~/.ssh/hogehoge.pem ./hello ec2-user@xx.xx.xx.xx:~/
```

```EC2(Amazon_Linux)
$ ./hello
-bash: ./hello: バイナリファイルを実行できません
```

となり実行できません

## Linux向けビルド

>参考までにEC2管理画面の情報です。
![](http://i.gyazo.com/bf32359aff06c272c5c16c8e413a9625.png)

Jxck_さんの記事([Go のクロスコンパイル環境構築](http://qiita.com/Jxck_/items/02185f51162e92759ebe))をもとに環境を整えます。


* Mac側で一度Goを入れ直しました。(入れ直さなくてもいけた?)

```Mac
$ brew uninstall go
```

* オプションをつけてGoを再インストール (詳しくは参考記事参照)

```Mac
$ brew install go --cross-compile-common
```

* hello.goをビルドします。`GOOS`と`GOARCH`を指定してビルドします。

```Mac
$ GOOS=linux GOARCH=amd64 go build hello.go
```

これでLinux向けの`hello`というバイナリが出来ます。

ちなみにMac側でビルドしましたが、Linux向けにビルドしているのでMacでは実行できません。

```Mac
$ ./hello
zsh: exec format error: ./hello
```


scp転送して、サーバーで実行してみましょう。

```EC2(Amazon_Linux)
$ ./hello
hello go!!
```

実行できました！
FloatingActionButton.Behavior をカスタムして使ってみる

![device-2015-06-23-201619.gif](https://qiita-image-store.s3.amazonaws.com/0/1897/b4b36822-22be-5d31-d434-d1ac11cfb6e0.gif)

CustomView で定義したフッターのバーに FloatingActionButton が乗っかるのがうざいので``FloatingActionButton.Behavior``をカスタマイズしてみた。

とりあえず、ソース。

```java
public class AwesomeView extends ViewGroup {
    public static class FabBehavior extends FloatingActionButton.Behavior {

        private AwesomeView mAwesomeView;

        public FabBehavior() {
        }

        public FabBehavior(Context context, AttributeSet attrs) {
        }

        @Override
        public boolean layoutDependsOn(CoordinatorLayout parent, FloatingActionButton child,
                View dependency) {
            mAwesomeView = findAwesomeView(dependency);
            return mAwesomeView != null || super.layoutDependsOn(parent, child, dependency);
        }

        @Override
        public boolean onDependentViewChanged(CoordinatorLayout parent, FloatingActionButton child,
                View dependency) {
            if (mAwesomeView != null) {
                updateFabTranslationForAwesomeView(parent, child, mAwesomeView);
            }

            return super.onDependentViewChanged(parent, child, dependency);
        }

        private void updateFabTranslationForAwesomeView(CoordinatorLayout parent,
                FloatingActionButton fab, View awesomeView) {
            float translationY = this.getFabTranslationYForAwesomeView(parent, fab);
            if (translationY != this.mTranslationY) {
                ViewCompat.animate(fab).cancel();
                if (Math.abs(translationY - this.mTranslationY) == (float) awesomeView.getHeight()) {
                    ViewCompat.animate(fab)
                            .translationY(translationY)
                            .setInterpolator(INTERPOLATOR)
                            .setListener(null);
                } else {
                    ViewCompat.setTranslationY(fab, translationY);
                }

                this.mTranslationY = translationY;
            }

        }

        private float getFabTranslationYForAwesomeView(CoordinatorLayout parent,
                FloatingActionButton fab) {
            final float offset = (mAwesomeView == null) ? .0f
                    : ViewCompat.getTranslationY(mAwesomeView) - (float) mAwesomeView.getHeight();
            return Math.min(.0f, offset);
        }

        // TODO: 複数の AwesomeView 対応できるように
        private AwesomeView findAwesomeView(View view) {
            if (view instanceof AwesomeView) {
                return (AwesomeView) view;
            } else if (view instanceof ViewGroup) {
                final ViewGroup group = (ViewGroup) view;
                for (int i = 0; i < group.getChildCount(); ++i) {
                    final AwesomeView awesomeView = findAwesomeView(group.getChildAt(i));
                    if (awesomeView != null) {
                        return awesomeView;
                    }
                }
            }

            return null;
        }
    }
}
```

本来なら SnackBarLayout のようにレイアウトを定義し、その内の要素でレイアウトを行なうのだろうけど面倒くさいので。
WindowsからRaspberry Piのリモート開発&GPIO操作を行う

# 概要
windows上のNetBeansからSSHを利用した
Raspberry piのリモート開発 と WiringPiを用いたGPIO操作を行うために行った事のメモ

# 開発環境
* windows8.1
* NetBeans 8.02
* JDK ver 1.8.0_45
* Raspberry pi model B+
* Raspbian ver 3.18

# NetBeans周辺のインストール

NetBeansを利用するにあたりJDKが必要なのでダウンロードしてインストール
http://www.oracle.com/technetwork/java/javase/downloads/index.html

以下より必要な機能を持ったNetBeansをダウンロードしてインストール
https://netbeans.org/downloads/index.html

# GPIOライブラリ　Wiring Piをインストールする
Raspberry piでのGPIO操作を簡単に行うために WiringPi を利用する
* Wiring Piのインストールから周辺が詳しく書かれているので参考に
    * http://sunnydays-k.hatenablog.com/entry/2015/03/11/235818
    * 上記のページと同じようにbuildまで

#NetBeansからホストの設定をする。
1.　新規プロジェクトの作成をする。

* NetBeansを起動する
* 新規プロジェクトからC/C++のアプリケーションを作成する。(デフォルトにて)

2.　ホストの追加を行う。
 
* 左上のタブ(ﾌﾟﾛｼﾞｪｸﾄ・ﾌｧｲﾙ・ｸﾗｽ・ｻｰﾋﾞｽ)からサービスタブを選択する。
* サービスタブからc/c++のビルドホストを右クリック、新規ホストの追加を行う。
* ホストの選択にて RaspberryPiのipアドレスを入力し、次へ
* RaspberryPiのユーザー名とパスワードを入力して、追加。

3.　プロジェクトにホストを設定する。
* 左上のタブ(ﾌﾟﾛｼﾞｪｸﾄ・ﾌｧｲﾙ・ｸﾗｽ・ｻｰﾋﾞｽ)からプロジェクトタブを選択する。
* プロジェクトタブから作成したプロジェクトを右クリックし、プロパティを開く。
* プロパティウィンドウからビルドカテゴリを選択
* ビルド・ホストにて追加したホストを選ぶ。

#NetBeansからWiringPiを使用する。
WiringPiを利用するためには、コンパイルのオプションとして記述しなければいけない。

* プロジェクトのプロパティウィンドウからC++コンパイラ選択
* 追加のオプションへ「 -lwiringPi 」と追記する。


#NetBeansからGPIOの操作を行う
RaspberryPiでGPIOの操作を行うためには管理者権限が必要

1.Raspberry Piにて管理者権限を付与するファイルを作成する。

* わかりやすい用にフォルダを作成　「mkdir NetBeansProjects」
* 作成したフォルダに移動
* わかり易いファイル名を作成「nano gdbsudo」
* 下記を記述する。

>\#!/bin/bash
sudo /usr/bin/gdb $*

2.デバッグ時にそれを利用されるようする。

* ツールタブを選択
* オプションを選択
* C/C++を選択
* デバッガ・コマンドへ　先ほど作成したファイルのパスを選択
* (例 /home/pi/NetBeansProjects/gdbsudo)


# 以上です。
作成したプロジェクトにGPIOの操作を行う処理を記述し、デバッグする事でGPIOの制御ができるようになりました。
お手軽DeepPacketInspection


pysharkはtsharkのラッパーなので、tsharkはインストールしてあることは前提

# Install Pyshark
Gitからインストールすることを推奨 (2015/06/20)
下記のパッチがあったものがリリースされていないから
pipでインストールすると`lxml.etree.XMLSyntaxError: internal error: Huge input lookup,` が起こる場合がある。
https://github.com/KimiNewt/pyshark/issues/75

```
$ git clone https://github.com/KimiNewt/pyshark.git
$ cd pyshark/src
$ python setup.py install
```

display_filterはtsharkの`-R`オプションになる。
https://github.com/KimiNewt/pyshark/blob/master/src/pyshark/tshark/tshark.py#L73

```python
import pyshark


    for p in pyshark.FileCapture(pcap_file, display_filter='http'):
        try:
            if p.http.request_method == 'GET':
                print(p.eth.src)
                print(p.eth.dst)
                print(p.ip.src)
                print(p.ip.dst)
                print(p.tcp.srcport)
                print(p.tcp.dstport)
                print(p.http.host)
                print(p.http.request_full_uri)
                print(p.sniff_time)
        except AttributeError as e:
            continue

```


#注意
tsharkで見れないものは当然見れないので、全てがDPIできるわけではありません。

libpcapなりを使ってちゃんとパースするのが正確です。
すこしそれますが、tcpdump(libpcapを使っている。tsharkも同様)でetherを直で見張っても300Mbpsを超えるあたりでパケットがカーネルで落ちます。（ハードの性能にある程度依存はある。）
`tcpdump -n -i eth0`

スループットが高いものを分析する場合は専門のハードなりに頼らないとギガのネットをフルでみるのは辛いです。
createDocumentFragmentはIE6で使える


## `createDocumentFragment`とは?

`createDocumentFragment`メソッドというものがあります。

[Document.createDocumentFragment() - Web API インターフェイス | MDN](https://developer.mozilla.org/ja/docs/Web/API/Document/createDocumentFragment)

大量のDOM Nodeを要素内に追加する時、一々DOMに追加するとパフォーマンスが低下しますが、これを回避するために利用できます。

[七章第四回　ノードをまとめて扱う: DocumentFragment — JavaScript初級者から中級者になろう — uhyohyo.net](http://uhyohyo.net/javascript/7_4.html)

このメソッドが生成するDocumentFragmentの本質は、親要素のない複数のDOM Nodeをグループ化出来る点にあります。
このため、使いようによっては非常に便利です。

## 古いブラウザで使えない(勘違い)

しかし、今まで私は積極的に利用してはいませんでした。
何故なら、古いブラウザで使えない(と思い込んでいた)からです。

しかし、改めて調べてみると…

* [javascript - DocumentFragment browser support - Stack Overflow](http://stackoverflow.com/questions/1353381/documentfragment-browser-support#1353385)
* [DOM Core](http://quirksmode.org/dom/core/#t132)

なんと、あの大問題児であるIE6 (Internet Explorer 6)でも扱えるとのこと。
ruby要素がIE5 (Internet Explorer 5)から使えると知った時並に驚いています。

## 結論

`createDocumentFragment`メソッドは、IE6でも利用できます。
MQTTとは？


名前しか知らないので、すこしだけググってみた。

# 一言でなに？
TCP/IP上で動作するPublish/Subscribe型のシンプルな非同期、双方向プロトコルである。(ここでいうシンプルはHTTPと比較して、という意味)


# ライセンス
ロイヤリティフリーで公開されている。

# 仕様
[ここ](http://public.dhe.ibm.com/software/dw/webservices/ws-mqtt/mqtt-v3r1.html)で公開されている。2015/06/23現在 MQTT V3.1
[仕様書(English)](http://public.dhe.ibm.com/software/dw/webservices/ws-mqtt/MQTT_V3.1_Protocol_Specific.pdf)
[仕様書(Japanese)](http://public.dhe.ibm.com/software/dw/jp/websphere/wmq/mqtt31_spec/mqtt-v3r1_ja.pdf)

ざーっと日本語版を読んでみた。フォントが詰まってて非常に読みにくい。
中身はググって出てきた内容でおおよそカバーしているように感じた。
MQTTサーバーのことをブローカーと呼ぶっぽい。


# MQTTを体験してみる
[MQTT、IBM MessageSightのご紹介 - IBM MessageSight for Developersを使ってMQTTを体験する](http://www.ibm.com/developerworks/jp/websphere/library/connectivity/ms_mqttintro/)

ここから、VMWare用のイメージをダウンロードして起動するとWebServerが立ち上がり、そこへアクセスすることで、IBM MessageSightへ接続することができた。
同じくClient Webアプリをダウンロードして接続して、Publish/Subscribeを体験した。あんまり実感わかなかったけど。
(ClientアプリをダウンロードするときにOpenSSHのパッチをダウンロードするとかで、IBMアカウントを作るはめになった)



# Link
- [HTTPからMQTTへ - IBMが提唱するモノとモノがつながる時代に最適化したプロトコル&アプライアンス 2013/12/13](http://it.impressbm.co.jp/articles/-/10773)
- [MQTTについてのまとめ](http://tdoc.info/blog/2014/01/27/mqtt.html)
- [MQTTについて詳しく知る](http://akane.shiguredo.jp/mqtt.html)


# 所感
Topic はOSC(Open Sound Control)みたいだな、と思ったw


おおよそ把握した。

おわり。
CakePHP3でアソシエーションごとsaveする


想定としては、一つの注文(Orders)に複数の商品(Items)が紐付いているようなデータ。
一つの登録画面で注文テーブルに保存する内容と注文明細テーブルに保存する内容を両方入力させてそのまままとめて保存したい。

モデル。

OrdersTable.php のイニシャライズのところにhasmany追加。

```php
    public function initialize(array $config)
    {
        $this->hasMany('Items', [
            'foreignKey' => 'order_id'
        ]);
    }
```

テンプレートは以下のように、Ordersの方のフォームはそのまま、Itemsの方は items.0.name というようにする。
もちろん0番目、1番目、という意味。

```php
        <?php
            echo $this->Form->input('order_date');
            
            echo $this->Form->input('items.0.item_name');
            echo $this->Form->input('items.0.item_price');
            echo $this->Form->input('items.0.qty');
        ?>
   ```

あとはbakeしたコントローラのpostのとこにassociatedを追加するだけ。

```php
        if ($this->request->is('post')) {
            $order = $this->Orders->patchEntity($order, $this->request->data, ['associated' => ['Items']]);
            if ($this->Orders->save($order)) {
                $this->Flash->success(__('The order has been saved.'));
                return $this->redirect(['action' => 'index']);
            } else {
                $this->Flash->error(__('The order could not be saved. Please, try again.'));
            }
        }
```

ここまではいい。問題ない。
問題なのはitemsテーブルとかじゃなくて、order_detailsみたいな単語連結型のテーブル名の時だ。
モデルはいいよね。OrderDetails 以外にあり得ない。
じゃあ、テンプレートのところ、
items.0.name となっている部分はどう書けばいいのか？

```
order_details.0.name
```

とするのだ。。

## 編集のとき
ちなみに、編集のときは、  

```php
[
	'items' => [
		(int) 0 => [
			'id' => '10' // <- NEW!
			'item_name' => 'aaa'
			'item_price' => '100'
			'qty' => 'hoge'
		],
	]
]
```
という風に、 `id` を一緒に渡してあげればよい。  
つまり、`id` があれば上書き、 `id` がなければ新規追加になる。
Git ShellでVimを使えるようにする

GitHub for Windows をインストールするとついてくる Git Shell。PowerShellで動いているようす。
Windows7にもとから入っているPowerShellだと、環境変数でパスを通せばVimが使えるのに、Git Shellからは動いてくれない。なぜに。”ファイルを開くプログラムの選択”の画面が出る。
とりあえず vim.exe が Git Shell から起動できれば良いか、という浅い考えのもとに

1. Aliasでvim.exeを実行させる
2. Git Shell起動時にAliasをセット

を実施。
よくわからなかったところの備忘録も合わせて書きます。


## set-aliasコマンドでVimを実行させる
Aliasの登録は以下のコマンド。

~~~~
Set-Alias vim {vim_install_dir}\vim.exe
~~~~

でもこのままだと、毎回コマンド実行しないといけないので、プロファイルを作ることに。

## Git Shell（PowerShell）プロファイル
起動時に記述している処理を実行してくれる。デフォルトでは存在しない。

プロファイルの解説は[ここ](https://technet.microsoft.com/ja-jp/scriptcenter/powershell_owner06.aspx)。
（なぜにこんなにもくだけた調子で解説されているのか。興味深い。詳細の理解は後回しにした。）

すでにプロファイルを作成している場合は、

~~~~
$profile
~~~~

でそのディレクトリがわかる。
どこでどうやって管理してるのかはわからないが。

プロファイルが作成されてなくても、`C:\Users\lw09003\Documents\WindowsPowerShell\Microsoft.PowerShell_profile.ps1`とか返ってくる。
挙動とか仕様とかはよくわからないけれども、とりあえず返ってきたディレクトリにファイルを作成して、上記のAliasのセットのコマンドを記述しておく。


## 実行確認
Git Shell を再起動して、

~~~~
vim
~~~~

でvimが起動したら設定OK。

GitもVimもまだまだ触り倒せてないので、これでかなり練習がはかどるはず。


## おまけ
上記のプロファイル作成したら、素のPowerShell起動したときに

~~~~
スクリプトの実行がシステムで無効になっているため、ファイル {powershell_profile_dir}\Microsoft.Power
Shell_profile.ps1 を読み込めません。詳細については、「get-help about_signing」と入力してヘルプを参照してください。
~~~~

と怒られた。
下記にて対処。（PowerShell、右クリックでメニューが出ないので使ってないけどなんか癪なので）

1. PowerShell上で `Set-ExecutionPolicy RemoteSigned`を実行
2. はい/いいえを聞かれるので、はい（y)を実行

これでもう、怒られない。
Clean Code that works(動作するきれいなコード）

<h1>Clean Code that works(動作するきれいなコード）</h1>
・きれいなコードを書く理由
ソフトウェアの多くは動くものを一度つくって終わりではない。
仕様変更等による修正、機能追加でコードを直していくもの。
その時、プログラマーは既存のコードについて理解する必要があり、そのコードが汚く可読性が低いものだと、生産性が落ちてしまう。
また、エラーが発生したときに修正がしずらい。（汚いコードだと、修正すべき箇所が他のどのコードに影響を与えているかわかりずらいから）

きれいなコードとは、人に意図を伝えるコードである。
自分の書いたコードを見るのは他人だけでなく、数週間後の自分の可能性もある。
コードを読んだだけで処理の流れがわかるような、きれいなコードを心がけよう。

<h2>簡潔性(simplicity)</h2>
プログラムを短く扱いやすい状態にしておく
<h2>明瞭性(clarity)</h2>
プログラムを人間にもマシンにもわかりやすく書く
<h2>一般性(generality)</h2>
幅広い状況できちんと機能し、新たな状況にもうまく対応できる
さいきんchefで調べたり使ったrubyのメソッド

初心者の自分用のメモです。

・subで置換
　gsubだと正規表現で置換
・改行を削除とか
http://hono-auto.seesaa.net/article/406385660.html
・行の末尾
$でいいもよう
http://www.rubylife.jp/regexp/anchor/index2.html
・linesで改行を区切りにして配列処理できる
http://ref.xaio.jp/ruby/classes/string/lines

```
   "#{hosts_mng_data}".lines(separator = "\n") do |line|
    if "#{line}" =~ /^#{localip}.*/ 
     newline = line.sub(/$/,' localhost')
     mng_local_data = mng_local_data + newline
    else
     mng_local_data = mng_local_data + line
    end
```

localのipと一致したら行末にlocalhost追加したかっただけです。
sedかperlならワンライナーだけどchef的にtemplateリソースでデータを差し込みたかった。


・文字列の連結

```
a = 'aaaa'
b = 'bbbb'
hoge = a + b
puts hoge
#=> aaaabbbb
```

方法別速度の比較↓
http://qiita.com/Kta-M/items/c7c2fb0b61b11d3a2c48

・uuidの求め方
http://qiita.com/smallpalace/items/8d222447253789436609

・pとputsのちがい
osコマンドだとechoのこと。
pだと色々でる検証向き。
putsだとクォートとかでない。


・pushで配列の末尾に要素を追加する
http://ref.xaio.jp/ruby/classes/array/push


・クラス
http://ref.xaio.jp/ruby/classes/class

・四捨五入はroundでいける
http://www.rubylife.jp/ini/numeric_class/index3.html

ohaiで搭載メモリの50%をGBになおしたもんをroundで四捨五入。

```
# Heap Size (defaults to 256m min, 1g max)
#ES_HEAP_SIZE=2g
ES_HEAP_SIZE=<%= ("#{node[:memory][:total]}"[/\d+/].to_f / 1024 / 1024 * 0.5 ).round %>g
```

インスタンスタイプのメタデータとってくるよりはohaiにがんばってもらったほうが。

・variables.merge!
ハッシュを連結してくれる。
http://ref.xaio.jp/ruby/classes/hash/merge

・if var
varに中身が入ってたら真

・include?
配列のなかに特定の文字列が含まれるかどうかを探す
https://hydrocul.github.io/wiki/programming_languages_diff/list/contains.html

```
mng_roles = [
    "change-password",
    "jenkins",
    "log",
    "monitor"
]

hoge = 'ldap'
hoge2 = 'aaaa'

p mng_roles.include?(hoge)

p mng_roles.include?(hoge2)
```

含まれればtrue、なければfalseがかえる

・セカンダリのIPをohaiで出す
http://qiita.com/ezaqiita/items/ac108ec887a665962b5c
http://aikotobaha.blogspot.jp/2013/07/chefohai.html

```
require 'rubygems'
require 'ohai'
oh = Ohai::System.new
oh.all_plugins

#p oh["network"]["interfaces"]["eth1"]["addresses"].select { |address, data| data["family"] == "inet" }[0][0]
host_address_val = oh["network"]["interfaces"]["eth1"]["addresses"].select { |address_key, address_val| address_val["family"] == "inet" }
 host_address_array = host_address_val.keys
puts host_address_array
```

・case分岐
特定の文字列が先頭からマッチしたら処理をわけたいことがあったので以下のように適当に動作確認を。

```
# cat /tmp/casetest.rb
hoge='aaa-mng'
fuga='aaa-dev1'
booo='dev99'

environments=[hoge,fuga,booo]

environments.each do |environment|
case environment
when /^aaa/
 puts "environment is aaa."
else 
 puts "environment is not aaa."
end
end
```

http://dangerous-animal141.hatenablog.com/entry/2014/12/24/085607


とりあえずこんなところで。
javascriptの学習で触ってみたいサイト

javascriptの学習の目標

[Code Combat](http://codecombat.com/play/dungeon)

[jsbin](http://jsbin.com/?html,output)

[Khan Academy](https://www.khanacademy.org/computing/hour-of-code/hour-of-code-tutorial/v/welcome-hour-of-code)

[Code Avengers] (http://www.codeavengers.com/)

[CSS dinner](http://flukeout.github.io/)

[JavaScriptワークブック](http://www.cutt.co.jp/book/html_818.html)

[５・６年生にもわかるやさしいjavascript](http://www.sky.sannet.ne.jp/masapine/java_top.html)
Elasticsearch のマッピング。日本語の単語が解析されてバラバラになっちゃう場合の対応

# Elasticsearchのマッピング定義についてです。
Elasticsearchにデータを登録して、いざKibanaで可視化しようと思ったら、
日本語の単語がバラバラに認識されちゃって困ったときの対応方法です。
ログのキーワード単位で集計したい時に、日本語がバラバラだと集計できないです。。

# マッピングを定義してから、データを登録しましょう。
Elasticsearchでは、マッピングを定義しないで、データを登録すると自動マッピングされますが、
想定したマッピングにならないことがありますので注意です。
ちなみに、マッピングについては、[こちら](https://medium.com/hello-elasticsearch/elasticsearch-9a8743746467)のサイトが勉強になります。
>Elasticsearch におけるマッピングとは、リレーショナルDBでいうところのテーブル定義に相当します。しかし、単にデータを格納する為のフィールドを用意して型を設定するだけではありません。Elasticsearch では、フィールドの型の他に言語解析処理などのドキュメントを検索可能にする為の各種設定が可能です。

# マッピング定義の仕方

日本語で、分かち書きしたくない項目については、**not_analyzed** を指定して、登録します。
そうすれば、日本語の文章がそのまま格納でき、ログの内容等でKibanaでの集計が可能になります。

```
curl -XPUT 'http://your_es_host_address/elasticsearch' -d
{
  "Your_Index_Name" : {
    "mappings" : {
      "Your_Document_Name" : {
        "properties" : {
          "@timestamp" : {
            "type" : "date",
            "format" : "dateOptionalTime"
          },
          "hoge" : {
            "type" : "string",
            "index": "not_analyzed"
          },
          "fuga" : {
             "type" : "string",
             "index": "not_analyzed"
          },
          "contents" : {
             "type" : "string",
             "index": "not_analyzed"
          },
          
        }
      }
    }
  }
}

```

# マッピング定義の確認
以下のコマンドでマッピング定義が確認できます。
not_analyzed属性がついていればOKです。

```
curl -XGET 'http://your_es_host_address/elasticsearch/Your_Index_Name/Your_Document_Name/_mapping?pretty=true'
```
配置付け

#ページの中央に配置

boxに対して、左右の位置をautoにしページのサイズに合わせて配置
margin: 0px auto 0px auto;

```lang:HTML
<div class="main0">
   <div class="box0">
	  <h3>自然との調和を目指す企業です</h3>
	  <p>ホームページサンプルは自然との調和を目指します。</p>
	  <p>革新的な技術で世の中を動かす企業を目指します。</p>
   </div>
</div>
```
```lang:CSS
.main0{
	border: solid #ebebeb 3px;
	width:922px;
	height:300px;
	margin:5px auto 0px auto;
	background:url(../img/mainImg.jpg) no-repeat;
}
.box0{
	border: solid transparent;
	width:320px;
	height:70px;
	margin:215px 0px 10px 10px;
	color:#FFFFFF;
	background-color:rgba(136,135,136,1);
	opacity:0.5;
}
```

text-align:center
文字に対して、中央揃えに配置

```lang:HTML
<address class="class01">Copyright(c) 2013 Sample Inc. All Rights Reserved. Design by http://f-tpl.com</address>
```
```lang:CSS
.class01{
	font-size:10px;
	text-align:center;
}
```

#補足・・・floatの解除
floatの解除をしないと配置する際、影響が出てくるので必ず配置解除をする

擬似要素を使って
after{content:"";display:block;clear:both;}
レスポンシブ信者によるレスポンシブWebデザインのデメリットとその解消方法

レスポンシブWebデザインのメリットとデメリットをまとめてみました。 
私はレスポンシブ信者ですので、あえてデメリットの方を詳しく書いています。 また、デメリットをどうすれば解消できるかも考えてみました。

#メリット
* リキッドレイアウト！
* URLが同じ！
* SEOに有利！

#デメリット
* 転送量が大きくなる！
* CSSが複雑になる！
* 古いブラウザNG！
* スマホ専用UIには勝てない！
* スマホでPC用表示できない！

詳細
http://blog.lqd.jp/webdesign/000986.html
SequelでPostgreSQLのUnix Domain Socketに接続する方法


結論
----

```rb
DB = Sequel.connect(adapter: "postgres", host: "/path/to/socket")
```


解説
----

`/path/to/socket/.s.PGSQL.5432` という Unix Domain Socket が存在するとき

```rb
require "sequel"
DB = Sequel.connect(adapter: "postgres", host: "/path/to/socket")
```

*host* にUnix Domain Socketのpathを指定します
 (ファイルではなくディレクトリを書くのがポイント)


あとがき
--------

Unix Domain Socketの事ばかり書いてる
仮想マシンをTimeMachineで効率的にバックアップする方法

※MacOSXを対象とした記事

仮想マシンのディスクイメージは巨大なバイナリデータである為、差分バップアップが取りにくい。少しでも変更があると全く異なるデータとして認識されてしまう為、TimeMachineバックアップの容量を無駄に消費してしまう。

* [[mac]TimeMachineバックアップ対象からVirtualBox仮想マシンを除外する](http://blog.hello-world.jp.net/mac-2/2126/)

仮想マシンの状態が変わる度、何十GBもの容量をフルで消費してしまうのはかなり非効率だ。だからといってバックアップはしたい。そこで、VMWareFusionとVirtualBoxの2つのソフトで、バックアップ容量を削減する為の方法を調べた。
***
_先に結論を言うと、Fusionユーザーは「AutoProtect」機能を。VirtualBoxユーザはOSXの「スパース・バンドル」ディスクイメージ内に仮想マシンを保存するのがてっとりばやい解決策だと思う。_
***
# 方法1. スナップショット機能を使用する

いずれの仮想環境にも、スナップショットと呼ばれる仮想マシンの状態を保存・ロールバックできる機能がある。この機能を使うと

1. スナップショットを撮った瞬間のディスクイメージを保存し、読み取り専用にする
2. スナップショット作成以降の変更は、新しく、容量の小さい差分ファイルに追記する

といった状態になる為、TimeMachineは「2」以後の新しい差分だけをバックアップしてくれる。

ただし、スナップショット以降の変更が積み重なるほど差分ファイルの容量は肥大化していく。いずれは巨大化してしまう為、定期的にスナップショットを作成する必要がある。

## VMwareFusionの場合は「AutoProtect」

VMwareFusionの場合は「AutoProtect」機能によって定期的にスナップショットを作成することができる。操作はGUIからできるのでカンタン。Fusionを使用しているユーザーはこの方法がおすすめできる。

[VMwareFusionのバックアップ方法は、TimeMachineとAutoProtectで完璧！](http://dai-dai.com/wp/?p=66)

## VirtualBoxの場合はシェルスクリプト

VirtualBoxには今のところ自動でスナップショットを撮る機能は用意されていない。その代わりコマンドラインからの操作が可能な為、VBoxManageのsnapshotコマンドを使用するか、Vagrantのvagrant-vbox-snapshotプラグインを使い、OSXのLaunchdなどから定時処理する方法が考えられる。

* [VBoxManage snapshotコマンド](http://vboxmania.net/content/vboxmanage-snapshot%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89)
* [Vagrantにスナップショット機能を加えるplugin、vagrant-vbox-snapshotの紹介](http://qiita.com/takuan_osho/items/682b776b41989f0b016f)
* [OS X の Launchd を cron の替わりに利用する](http://loumo.jp/wp/archive/20140411120647/)

コマンドラインを使う方法は慣れた人なら簡単で自由に作れるかもしれないが、筆者は面倒なので後述の方法2を採用している。

# 方法2. SparseBundleディスクイメージに保存する

MacOSXのディスクイメージファイル(拡張子dmg)にはいくつかフォーマットがあるが、スパース・バンドル形式のディスクイメージを使うと、変更を細かい差分ファイルに分割して保存してくれる。このディスクイメージ内に仮想マシンのファイルを全て放り込んでしまえば仮想化ソフト側で特に設定をする必要はない。

[Mac - Sparse Bundle Image ノススメ](http://blog.livedoor.jp/dankogai/archives/51704256.html)

使い方は、「ディスクユーティリティ」で適当なサイズのスパース・バンドル形式のイメージを作成・マウントし、VirtualBoxの環境設定から仮想マシンの保存先に設定してしまえば良い。ログイン項目に追加しておけばさらに便利になる。