dorapon2000’s diary

忘備録的な。セキュリティとかネットワークすきです。

vimの最低限な基本操作まとめ(自分用メモ)

普段はVSCodeemacsを使うため、vimは全然使い慣れていません。しかし、サーバには基本的にemacsが入っていないため、エラーが発生した特定の行を見たり、設定ファイルの一部分だけ編集する際はvim(vi)を利用します。慣れたほうががいいとは思いつつ、モチベーションが湧かないため、最低限の操作だけできるような意識が低いメモです。(まとめながら覚える)

これだけはできるようになりたいこと

  • ファイルの保存
  • 単語検索・置換
  • 特定行に移動
  • 1行削除
  • コピペ
  • undo

移動は十字キー

モード

vimには文字を書き込める「挿入モード」とvimのコマンドを打つ「コマンドモード」があり、使い分ける必要がある。モードごとにできる操作が違う。

キー 使用できるモード 説明
Esc 挿入 コマンドモードにする
i コマンド 挿入モードにする

vimを終了する

変にファイルを編集してしまったのに、vimの操作を完全に忘れて、にっちもさっちもいかなくなったときはEsc :q!vimで一番最初に覚えた。

キー 使用できるモード 説明
ZZ コマンド 保存して終了
:q! コマンド 保存せずに終了

検索

キー 使用できるモード 説明
/検索単語 Enter コマンド 検索
n コマンド 次の検索単語へ
N コマンド 前の検索単語へ

移動

キー 使用できるモード 説明
gg コマンド ファイル先頭へ
G コマンド ファイル末尾へ
50G コマンド 50行目へ

それぞれ:0 :$ :50でもいける。

コピペ

yはヤンクのy。

キー 使用できるモード 説明
/検索単語 Enter コマンド 検索
dd コマンド カーソル行切り取り
yy コマンド カーソル行コピー
3yy コマンド カーソル行から3行コピー
p コマンド カーソルの右側にペースト
v コマンド ビジュアルモードへ(選択コピーできるモード)
y ビジュアル 選択範囲をコピーしてコマンドモードへ

その他

キー 使用できるモード 説明
:%s/検索単語/置換単語/g Enter コマンド ファイル全体で一括置換
u コマンド undo
Ctrl-o コマンド 挿入 一時的にコマンドモードのコマンドを入力できる

参考

HHKB Professional HYBRID Type-Sの感想

HHKBデビューしてから1ヶ月以上経ったのでその使い心地を書きます。

www.pfu.fujitsu.com

HHKBの前

平たくて打鍵音が小さいキーボードを使っていました。 mac bookなら備え付けのキーボード、windowsのデスクトップ機でもパンダグラフのキーボードです。 平たいキーボードを使っていた理由は、押し込む距離が短くてはやいタイピングができる気がするのと、比較的静音だからでした。

一時期自分がやり込んでいたゲームでは、タイピングスピードが重要でした。コンマ秒という刹那の勝負になりがちで、キーのストロークが大きいことすら不利になるんじゃないかと懸念していました。そのこともあり、平たいキーボードが好みでした。

購入するときに考えたこと

  • タイプ音の大きさ
  • 色・配列・刻印の有無

HHKBは一度店頭に展示されていたものを触ったことがあります。その時はすごく気持ちがいい打鍵感だけど音は結構するなぁという印象で、人前で使うとうるさくないか気になって集中できないかもしれないと思っていました。 今回購入したType-Sは割と静かという口コミと、Youtubeでも叩いていた動画をいくつか視聴してよさげだったので、何事も経験だと思って買ってみることにしました。 また、最近テーブルをスッキリさせたいという気持ちもあったのでBluethooth対応のHYBRIDにしました。

悩ましいのはキーボードの配列と色、刻印の有無です。HHKBというと黒のものを持ってる人が多い印象なので、天の邪鬼な私は白にしました。他の人のものと間違えづらいという理由もあります。配列はキーボードをシンプルにしたい気持ちを抑えてJIS配列にしました。次のようなことを考えました。

  1. 十字キーがないと生きていけないから
  2. 普段遣いがJISだから
  3. 自分のPCを他の人に貸すときにJISのほうが慣れている人が多いから

JIS配列だと無刻印はなさそうです。あったとしてもHHKB初心者ですし、慣れるまでは刻印ありがいいと思っていました。

実際に使ってみて

f:id:dorapon2000:20210121032237j:plain

上がWin機で使っているキーボードで、下が今回購入したもの。アクセント用の赤青キートップも購入しました(高かったです)。

気づかぬうちに手放せなくなっていました。サコサコという打鍵感と打鍵音がとても気持ちいいです。今まで平たいキーボードを使っていて気づきませんでしたが、ストロークが深いと打ち間違いが減ります。タイプ音も想像通り静かでした。タイピング速度は、、、ちょっとわかりません。

Bluethoothについて

ただ、せっかく買ったBluetooth対応ですが、今はUSB接続で利用しています。理由としてはいくつかあります。

  • 毎回キーボードのスイッチをONにしないといけない
  • 同じキーを連続でタイプすると1タイプ分しか認識しないことが多い
  • なぜかタイプしている間にカーソルが見当違いなところにワープする

USB接続にしてからは上2つの問題は解消して、3つ目はたまにありますが頻度が減った気がします。

HHKBのJIS配列について

自分は大文字の「N」を入力する際に「右Shift」「n」を右手で同時押ししていました。しかし、HHKBのJIS配列の右Shiftは↑矢印の分だけ小さくなっているため(上図)、右手だけで完結させることが難しかったです。今は右手「右Shift」+左手「n」と入力しています。未だに慣れていません。

ファンクションキーはFnキーを押しながらの入力になります。これを入力するときは刻印があってよかったと思っています。

半角/全角キーは普段から使っていなかったため、その位置にEscが来て押しやすくなりとても満足です。

まとめ

Bluetoothであったことと配列が少し違うことで戸惑う部分もありましたが、今では慣れて毎日この打鍵音を聞きながら作業しています。買う前からだとあんまり想像していない姿でした。麻薬な気がします。

最近読んだ本の感想2

前の感想記事から1ヶ月経って、読んだ本が貯まってきたので復習を兼ねてまたまとめておく。

dorapon2000.hatenablog.com

読んだ本一覧

技術系

その他

アカマイ 知られざるインターネットの巨人

インターネット通信量の約3割を取り仕切っていると言われるアカマイ社のCDNを実現する仕組みとビジネス構造を紹介している。

以下の記事を書く際にabemaがアカマイのCNDサーバからストリーミング配信をしていたため、気になって購入。

HLSのHTTPヘッダを見る - dorapon2000’s diary

アカマイとそのビジネス構造について知れたのは興味深かったが、それよりもインターネットの構造について知れたのがよかった。管理するネットワーク規模が大きいとなぜビジネス的に有利なのか、雰囲気はわかるが具体的な部分を知りたかった。この本ではインターネット中のデータの流れからお金の流れを説明してくれている。CDNもどのように実現しているのかわかっていなかったが、DNSのCNAMEを利用していることもわかった。また、通信事業会社ではないのに同等のネットワークを持っているGoogleAmazonといったビッグテックの立ち位置もわかった。2015年の話なので現在だと事情が変わっているかも知れないが、とてもおもしろかった。

詳解HTTP/2

2018年時点での、HTTP/1.1とTCPの問題点とそこから生まれたHTTP/2の仕様を網羅的に説明している。また、HTTP/3についても触れている。

詳解HTTP/2

詳解HTTP/2

読んだ第一の感想はHTTP/2がすごいTCPと似てるということ。L4でしていた制御をL7に持ってきた感じがあった。

  • TCPではコネクション単位で管理するが、HTTP/2ではストリーム単位で管理する
  • TCPの受信ウィンドウ(rwnd)と似た仕組みが、HTTP/2でWINDOW_UPDATEフレームとして存在する
  • TCPではRSTフラグでコネクションを強制終了できるが、HTTP/2でRST_STREAMフレームとして存在する
  • TCPではDSCP値で優先制御できる仕組みがあるが、HTTP/2でもフロー制御として存在する

HTTP/2の特徴の1つのサーバープッシュはメリットがない割にリスクが高いと言及されていたが、実際にChromeではサポート廃止が検討されてる*1。先見の明あり。

HTTP/2を使うからと言って必ずしもHTTP/1.1より性能が良くなるわけでもないこともわかった。特にパケットロスについて1.1より性能が落ちがちというのは覚えておかないといけない。

WEB+DB PRESS Vol.119

  • 特集1 フロントエンド脱レガシー
  • 特集2 インフラ障害対応演習

WEB+DB PRESS Vol.119

WEB+DB PRESS Vol.119

  • 発売日: 2020/10/24
  • メディア: Kindle

インフラ障害対応演習の特集で、障害対応は属人化しやすいから予めチームで演習をするとよいというアドバイスが記憶に残った。障害対応はだいたい緊急なので、一番慣れている人ばかりが毎回担当をして、それ以外の人にノウハウがたまらない。なるほどと思った。

サイボウズさんの脱レガシーの特集も実践的なアドバイスが盛りだくさんだった。一番の学びはテスティングトロフィーでフロントエンドのユニットテストを書きすぎてはいけないということ。記事には細かく書かれていないが、どうやらユーザーが実際にする操作のテスト(結合テスト)を増やすほう効率がよいということらしい*2

Software Design 2018年8月号

スマホゲームがどのように実装・運用されているかを実際のゲームを例に紹介されていた。

本棚に眠っていた一冊。こちらは実際にスマホゲームを作る上で現実の開発者がなにを考えているのか知れたのが学びになった。以下は特に印象に残った部分。

  • 通信を減らすために一部のマスタデータをクライアントに保存してしまう
  • KPI用のログをDBではなくAmazon S3に保存し、Amazon Athenaで集計する
  • JSONの代わりにMessagePackを用いる

個人開発をはじめよう!クリエイター25人の実践エピソード

個人開発の上で学んだ技術やマネタイズの方法、マーケティングの方法、モチベーションの保ち方などが25人もの人によって紹介されている。

どの話もためになった。未経験者が3ヶ月でそれなりのサービスを作ったり、1ヶ月でマネタイズまでできるサービスを作ってしまったりなど刺激をもらった。

個人的に気に入っているのはドヤ駆動開発とビルド&ゾンビ開発。ドヤ駆動開発は身近な人がほしいと言ったサービスを1日でつくりドヤることでモチベーションを保つ方法。ビルド&ゾンビは、必要最低限のデザインと機能、リリース後に改変作業がでないような設計でサービスをリリースして、運用後のモチベーションの維持問題を回避するというもの。自分もモチベーションが続かず断念した開発があるので、こういう話は重宝する。

Modern Perl 4th edition

Perl 5.22時点でのなういPerlの書き方とその注意点を紹介してくれている。Perlの思想から基本文法、テスト、Mooseと一通り抑えている。英語。

modernperlbooks.com

おすすめされた本。以前Perl Best Practiceを読んだが、内容が少し古いのと、一度Perlを体系的に抑えたかったというのもあって新しくこちらも読んだ。そして、読んでよかった。細かい仕様を理解していないとバグを作りかねない。特にautovivificationは大変ややこしい。これについては自分でも挙動を確認して記事にした。

Perlのautovivificationをいろいろ実験 - dorapon2000’s diary

eachなんかも便利に思えたがそんなこともなかった*3。バグを作らないこと以外に、Perlは様々なコードの書き方があるため、他の人のコードを読むためにも網羅的に理解しておくことは大切。

におうコードの問題集 ソフトウェア設計に立ち向かう編

開発負債になりそうな設計の見つけ方をSOLID原則からとてもわかりやすく紐解いてくれる。

booth.pm

以前、ドメイン駆動設計入門を読んだが、別の視点からも設計を考えたいと思い購入(ドメイン駆動設計もSOLIDなので別の視点と言えないかも知れないが)。悪い/良いでクラス図と一緒に説明してもらえるため、大変わかりやすかった。タイトルにあるように、におうポイントも教えてくれるため、もし自分のコードがにおえばSOLIDに反しているということになる。SOLIDの原則は覚えては忘れてで、今回もあぁはいはいあれねで説明はできないので、こうやって集中的に学べてよかった。

本はどう読むか

文学の教授で読書家の方の本に対する姿勢のエッセイ。なんと1972年の本なのに現在でも評価が高い。

本はどう読むか (講談社現代新書)

本はどう読むか (講談社現代新書)

息抜き枠兼、50年も前のエッセイが今でも評価が高いことに興味が出て購入。エピソードは古いが内容は今でも充分通用すると思った。もちろん、本との出会いが一期一会であった当時とインターネットが生活インフラになっている現代は状況が違う。だが、読書よりメディア(当時はテレビやラジオ)の方が知識の獲得が受動的になり、自分で考える機会を失うというのは今でも言われていること。むしろ、それが50年前から言われてたことに驚く。個人的に響いたのは、本の感想を書くことは、労力を使うが内容の取捨選択と考察を伴うため内容の理解につながるということ。実際に、著者は学生のレポート課題を感想文にしていた。こうして感想記事を書いているのもこの本に影響を受けてのことだった。

お金2.0 新しい経済のルールと生き方

価値主義や有機的システムなどを使い、著者が資本主義を代替する新しい経済の考え方を提案する。

プライムリーディングで無料になる前から気になっていた本。これからは資本主義から情報や影響力、共感などを軸にした価値主義へ移行していくと訴えている。価値はお金に転換可能なため、価値主義は資本主義を包含していると言われて、一理あると思った。例えば、フォロワーが多い人が広告をつぶやけば、影響力をいつでもお金に変えることができるし、逆にお金のやり取りなしに社会を動かすこともできる。価値主義ではお金も影響力も1つの媒体になっている。個人的に、この本は「ソーシャルメディアの生態系」「予想通りに不合理」「消費者は4回評価する。だからファンが大切。だから刹那的なインフルエンサー起用は意味が薄いというお話。」らへんの話をいい感じにまとめているのではないかと思った。

HLSのHTTPヘッダを見る

HLSのHTTPヘッダを見てみたいというリクエストがあったのでHLSのヘッダを見てみる。

HLS

HLSはHTTP Live Streamingの略で、Appleが提案したストリーミング配信の仕組み。ネットワークの帯域を考慮して配信する動画の画質を配信中に切り替えられ、現在はニコ動やYoutube、Abemaなどで広く利用されている。

HLSは2種類のファイルから構成される

  • m3u8:取得するセグメントを記したインデックスファイル
  • ts:動画を断片化したセグメントファイル

Chromeの開発者ツールでAbemaのそれぞれのファイルのHTTPヘッダを確認した。

m3u8ファイル

f:id:dorapon2000:20201106220331p:plain

HTTP/1.1 200 OK
Content-Encoding: gzip
Content-Length: 217
X-Akamai-Path-Stats: [3:1068:47932],[1:9793:7207],[1:16613:387],[1:14838:31162],[1:20680:4294957616]
Cache-Control: max-age=30
Date: Thu, 05 Nov 2020 14:22:55 GMT
Connection: keep-alive
Vary: Accept-Encoding
Akamai-Mon-Iucid-Del: 626621
Content-Type: application/x-mpegURL
Access-Control-Max-Age: 86400
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: Server,range,hdntl,hdnts,Akamai-Mon-Iucid-Ing,Akamai-Mon-Iucid-Del,Akamai-Request-BC
Access-Control-Allow-Headers: origin,range,hdntl,hdnts
Access-Control-Allow-Methods: GET,OPTIONS
Access-Control-Allow-Origin: *

HTTPバージョン

HTTP/1.1 200 OK

AbemaはHTTP/2で通信をしているが、m3u8ファイルとtsファイルはHTTP/1.1で取得していた。AbemaのHLSファイルはAkamaiCDNから配信されているため、CDNが単にHTTP/2対応してなかった可能性もあるが、HLSとHTTP/2は相性が悪いのではないかとも思った。

HTTP/2はファイルダウンロードの並列数を増やして全体的なパフォーマンスをあげる代わりに、1つのファイルあたりのダウンロード時間は長くなっている。ストリーミング配信ではページを開いてから再生できるまでの時間が短いほうがよいわけで、1ファイルのダウンロードに時間がかかるのは相性が悪いのかもしれない。

あるいは、HTTP/2のパケロスによるパフォーマンス低下をケアしたのかもしれない。HTTP/2は単一TCPコネクションの中で擬似的に複数のファイルストリームを作り、並列にダウンロードできる。しかし、単一TCPコネクションであるがゆえに、どこかのストリームでパケロスするとTCP輻輳窓が落ち、すべてのストリームで送信速度が低下する。後ろで再生するtsファイルのパケロスで今欲しいtsファイルのダウンロードが遅れては悲しすぎる。

同じ疑問がStackoverFlowで投稿されていた。

stackoverflow.com

With video streaming, there are not that many concurrent small requests - instead the client fetches larger chunks piece by piece. This should work pretty fine on top of HTTP/1.1 connections with keep-alive

(動画ストリーミングにおいては、小さなリクエストが並列に実行されるわけではなく、大きなチャンクで1つずつ取得される。この場合HTTP/1.1のkeep-aliveのほうがより優れた性能を発揮するはずだ。)

こちらの回答がそれっぽいが、なぜ優れた性能を発揮するのか理由がよくわからなかった。性能としては同じくらいにならないのだろうか。

Content-Encoding

Content-Encoding: gzip

コンテンツの圧縮方式をgzipで指定している。jpg画像などはすでに圧縮されているため、さらに圧縮すると逆に容量が増えてしまうため注意が必要。

Cache-Control

Cache-Control: max-age=30

30秒だけキャッシュしてよいとしている。動画は変わるものではないのだから、30秒といわず1日キャッシュして良い気がするが問題があるのだろうか。

Connection

Connection: keep-alive

HTTPのコネクションがKeep-Aliveであることを意味する。動画の再生に応じてtsファイルをダウンロードする必要があるのだから、コネクションは毎回やり直したくないという意味。なお、HTTP/2の場合keep-aliveしてはいけない*1

Content-Type

Content-Type: application/x-mpegURL

RFC8216では、必ずapplication/vnd.apple.mpegurlaudio/mpegurlでなくてはいけないとあるが、Abemaでは独自にMIMEを定義しているようだった。x-というのはかつて非公式なHTTPヘッダにつけられていたサフィックスと同じで、独自MIMEをあえてつけていることになにか理由があるのかも知れない。

In the second, the HTTP Content-Type MUST be "application/vnd.apple.mpegurl" or "audio/mpegurl".

CORS

Access-Control-Max-Age: 86400
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: Server,range,hdntl,hdnts,Akamai-Mon-Iucid-Ing,Akamai-Mon-Iucid-Del,Akamai-Request-BC
Access-Control-Allow-Headers: origin,range,hdntl,hdnts
Access-Control-Allow-Methods: GET,OPTIONS
Access-Control-Allow-Origin: *

CORSはオリジン間リソース共有のことで、XSSCSRF対策の1つ。仕組みは徳丸先生の動画がとても参考になったためそちらに譲る。

理解しきれていないので間違っているかもしれない。

tsファイル

f:id:dorapon2000:20201107032936p:plain

HTTP/1.1 200 OK
Content-Length: 421888
Date: Fri, 06 Nov 2020 16:54:18 GMT
Connection: keep-alive
Akamai-Mon-Iucid-Del: 655733
Content-Type: video/MP2T
Access-Control-Max-Age: 86400
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: Server,range,hdntl,hdnts,Akamai-Mon-Iucid-Ing,Akamai-Mon-Iucid-Del,Akamai-Request-BC
Access-Control-Allow-Headers: origin,range,hdntl,hdnts
Access-Control-Allow-Methods: GET,OPTIONS
Access-Control-Allow-Origin: *

m3u8との相違点

まとめ

HLSの場合HTTP/2を使わないというのも、こうやって調べないと気づけなかった。また、何でもかんでも圧縮すればいいわけではないこともわかった。勉強になる。

参考

HLS動画ストリームの確認方法 - Qiita

HTTP Live Streaming - Wikipedia

Is it possible to do HLS streaming over HTTP/2, and will it be better latency-wise than over HTTP/1.1? - Stack Overflow

オリジン間リソース共有 (CORS) - HTTP | MDN

CORSまとめ - Qiita

CORSの原理を知って正しく使おう - YouTube

【小ネタ】CloudFront のファイル圧縮機能で HLS コンテンツが圧縮されるのか調べてみた | Developers.IO