※スマホ対応はしてません。

Surface Pro 3が出るので、そろそろ初代を一年くらい使った感想を。割と気に入ってるよ。

カテゴリー: 未分類

surface-pro

いよいよ今月発売だそうで。Win 8はタッチ操作が大変快適です。

購入したもの

Surface Proです。2とかRTとかじゃなくて。

あ、最初に

“Surface”と”Surface Pro”の違い

について書いておこう。

非常に紛らわしいのですが、Surface RTやSurface 2のOSは”Windows RT”というタブレットとか向けの別物です。要は Proじゃない方のSurfaceはWindows機じゃない って事。Windows Phoneに近くて、普通のWindows用ソフトは動きません。間違えないでね!

これはMicrosoftがevilだと思う。

全体的には満足してます

lgtm
Looks Goot To Me

形状が特殊なので必ずしも万人にお勧めはしませんが、個人的には気に入っています。いやもうタッチ操作最高すぐる。

スペックは高めらしい? ニコニコ動画のコメントは数が多くてもスムーズに動いてます。艦これも楽々動くそうですよ。(やった事ないけど。)

ちなみに当方Windows 98→XP→Mac OS X (MacBook Pro)→(MacBook Air)→Windows 8 (Surface Pro)という乗り換え履歴です。Macも良かったよ、というか現在も仕事では併用してます。

残念なところ

先に悪いお報せです。(Pro 3で改善されたらしいものは除きました。)

スリープモード

本体右上にボタンがあって、そこを押してスリープモード?に入る。

いやいや、そうじゃないだろ。そこは画面をオフにするだけで、中身は動き続けていてくれないと。音楽聴きながらちょっと席を移動しようとしたらとりあえずぽちっとするだろ。しないと画面がそのままじゃん、間違って触ったら間違った操作になっちゃうじゃん、だからiPadでもそうでしょ。ぽちっとするじゃん。するとマシンが止まるじゃん。音楽止まるじゃん。だめじゃん。どうしろってのこれ。

あと長距離移動するときとか、本当にスリープモードにしたいとき、まあしょうがないからさ、ぽちっと押したらスリープする。うん、そこまでは想定通り。でもさ、それが鞄の中で何かのはずみに復帰しちゃうのはどうしたら良いのよ。いやもちろん復帰してもまだログイン前画面だからそのまま誤操作とかないけどさ、でもほら、その後スリープしないじゃん? 付いたら付きっぱなしじゃん? 電池減るじゃん? 鞄が熱くなるじゃん? なにカイロなの? なんでこうなるの? 画面全体が反応するせいなの? スリープ前にこすれて操作されたと思っちゃうの? あとやった事ないけど、もしかしてこのタイミングで音も鳴るの? どうしろってのこれ。

OSの仕様とも関係してくるのだろうけども、タブレット向けなら画面オフのあたりにも気をつけて欲しかった。ここは強い不満を抱えている。

Type Coverのトラックパッド

別売りのやつ。キーは悪くないのだけども、トラックパッドが駄目。

何やら動き始める前の「遊び」が変にあるみたいで、ちょっと指を動かしても反応しない。それは普通かもしれないけども、もうちょっと動かすと反応して、そうすると一気に飛ぶ。なんぞ。結局ここで微調整する事が不可能なので、わざと大きく動かしてからカーソルを戻して微調整する事になる。なお静止してしまうとまた「遊び」が邪魔をするので、静止しないよう少しずつ動かしながら微調整する。ひどい。……うーん、うまく言えないな。

結局別のBluetoothキーボードを購入して利用している。

電源ケーブル

アダプター部分?が四角い。ケーブルを巻き付けると断線しそう。握りしめると痛い。(?)

adopter
こんな。

あと本体右側に、MacBookのMagSafeみたいな、磁石付きで「ばちこーん」てなるのがあって、これは便利なんだけども、なんでか装着しづらい。本来の位置とは違う場所にばちこーんて引っ付いてしまう。そしてケーブル側の口が四角く尖ってるので、本体を削ってしまう。

(ついでに、まあ仕方ないのだけども、MacBookみたいに一般化していないので誰かに借りられる可能性は低い。きちんと持ち歩かないといけない。いや本当、これは仕方ないのだけども。)

アプリストアが閑古鳥

うう。流行ってくれえー。

普通じゃない

やっぱりキーボードとかは「普通のノートパソコン」じゃないので、それを期待すると嫌になりそう。個人的には全然困ってはいないけども、一応。

良いところ

タッチ操作

これ最高。ちょっとした操作をしたいとき(画面スクロールとか)視線を画面に固定したまま行えるのってすごく楽。

ワンパンマン 35撃目[ボロスの本領](1) / 原作/ONE 作画/村田雄介 – ニコニコ静画 (マンガ)

だらーっと2chとかニコニコ動画とかネットサーフィン(死語)するときは、タブレットとして手に持って楽な場所に移動して楽な姿勢ですーいすいと使える。スクロール量も思い通りにいくし、(ブラウザーによるけど)拡大縮小も指でできる。素晴らしく楽。

自宅で食事中にネットをぽちぽち見てるんだけど(一人暮らし)、そういうときも指で操作できるのは大変ありがたい。

デスクトップアプリ(普通のWindowsアプリ)はタッチ操作に最適化されていないけども、一応マウス代わりに基本的な操作はできます。まあ小さいボタンだとさすがにつらいけども。

あとあまり一般的な用途じゃないけども、コードレビューとかするときにスクロール操作を指でできるの、すごく良い。口頭であれやこれやと説明するのって大変だし、相手からマウスとか受け取るのも面倒だし。本当に楽。

ペン

個人的に世界が広がった。今までだと絵を描くときはマウスでぽちぽちやるか、指でふにゃふにゃやるかだったんだけど、ペンが使える事ですこぶる描きやすい。当たり前だけど。iPadでお絵描き用にペンみたいなやつ買おうかちょっと迷った時期もあったけれども、やはりペンは細いのが良いと思います。

ちなみに絵を描くといっても本格的に絵描きさんみたいなのを目指してるんじゃなくて、発表資料の端の隙間にペンギンがいるとかそういうのです。絵描きさん的にはどうなんだろう?

quad-core
これとか。

電池の持ち

十分持ちます。最近の機体はだいたいそんなもの? 流行を知らないので何とも。

再起動が早い

今のこの機体だと、だいたい三十秒弱で再起動できました。

Windowss Updateで更新したりちょっと大袈裟なアプリを入れて再起動するときも大して待たずに完了できます。とはいえ、再起動前に全部終了させないといけないのは相変わらずなんですが。

軽さ

軽いはず。

でも見た目がタブレットなせいで、「手に持ってみると意外に重い」という評価になりがち。実際はMacBook Airより軽くてiPadよりは重いという位置付けです。

MS Office

まー別にGoogle Appsやらで良いのではーとか思ってたんですが、いや、使ってみるとやっぱり完成度高い。なんんだかんだで便利です。

電源アダプターのUSBコンセント

何て言うんだろ、USBを指す穴がアダプターのところに付いてて、給電できます。地味に便利。接続じゃなくてあくまでも給電のみ、なんだけど。

adopter
左側手前の穴がそれ。

ちなみに本体にはUSBの穴はひとつだけです。

その他

板(本体)が自立するよう足が付いてるんだけど、この角度があんまり……。この点については2で二段階になって、3では無段階に傾けられるよう性能向上しているそうなので、楽しみ。

そういえばPro 3ではできるみたいな宣伝だけど、いやそれは無理だろ……。

カメラ

カメラが前後に付いてて便利そうなんだけど、解像度が低くてPC画面だと見るに堪えない程度の撮影しかできなかった。これもPro 3で改善されてるらしい。

まあiPadもそうだったけど、タブレット機のカメラってあんまり使わんよね。あったらあったで便利かなあ。

ディスク容量

128 GBのやつにしました。外付けHDDを持っているせいもあって、特に不自由してません。開発用にVM入れたらさすがにきつかったので、それは外付けの方へ。

MS謹製の無料で使えるオンラインストレージOne Driveを活用すると良いのかも。これも使ってないや。

CDとかDVDとか

MBA同様光学ディスクドライブは付いていないので、別途購入の必要あり。最近は何でもインターネット経由だったりするので不要なら買わないでも良さそう。

ちなみに本来DVDの再生にはライセンス料が必要で、今まではMicrofostが支払っていてくれたのだけど、それがWin 8からはなくなってしまったらしい。Windows Media PlayerでDVD再生できません。プレイヤーアプリ付きのドライブを選ぶか、Windows Media Centerとかいうやつ(800円)を買いましょう。

Windows 8

これなー、批判的な意見が多いですね。自分は結構好きなんだけどなあ。新しいスタートメニューとか。

リボンUIにもすぐ適応できた方なので、元々こういうのが好きなのかも。ただタッチ対応していない機種だとあまり便利さを感じられないかもなあとは思いました。据え置きのディスプレイとか。とはいえ、デスクトップモードの方は全然問題ないと思うのですが……。

ストアアプリ

例のフルスクリーンじみた画面で動かす、普通のデスクトップアプリじゃないやつ。

正直あまり使ってません。ストアも閑古鳥だし……。2ch viewerも良いのないかなあ。2ch自体が下火か。一番良く使っているのがIEで、続いてYahoo天気。(IEはストアアプリ版とデスクトップアプリ版の二種類入ってます。ブックマーク情報なんかは共有されているみたい。)

ちなみに画面分割して二つまで同時に利用できます。片方をデスクトップにする事も可能。

総括

便利に仕事(プログラミング)したりだらっと2ch見たりで使ってます。電源ボタンとTouch Coverのトラックパッドだけはどうにかしてもらいたい……。

JavaScriptStackTraceApi邦訳。Errorオブジェクトのstackについて。

カテゴリー: JavaScript

Google ChromeやNode.jsで利用可能なAPIです。Firefox等には搭載されていません。(まーあんまり使う場面なさそうですけど。)

以下、翻訳です。


All internal errors thrown in V8 capture a stack trace when they are created that can be accessed from JavaScript through the error.stack property. V8 also has various hooks for controlling how stack traces are collected and formatted, and for allowing custom errors to also collect stack traces. This document outlines V8′s JavaScript stack trace API.

V8で投げられたあらゆる内部エラーは、生成時のスタックトーレスを獲得します。これはJavaScriptのerror.stackプロパティを通してアクセス可能です。V8には他にも、スタックトレースの収集、書式化を制御する複数のフックや、カスタムエラーでスタックトレースを得るフックもあります。本文書はV8のJavaScriptスタックトレースAPIの概要です。

Basic stack traces – 基本的なスタックトレース

By default, almost all errors thrown by V8 have a stack property that holds the topmost 10 stack frames, formatted as a string. Here’s an example of a fully formatted stack trace:

ReferenceError: FAIL is not defined
   at Constraint.execute (deltablue.js:525:2)
   at Constraint.recalculate (deltablue.js:424:21)
   at Planner.addPropagate (deltablue.js:701:6)
   at Constraint.satisfy (deltablue.js:184:15)
   at Planner.incrementalAdd (deltablue.js:591:21)
   at Constraint.addConstraint (deltablue.js:162:10)
   at Constraint.BinaryConstraint (deltablue.js:346:7)
   at Constraint.EqualityConstraint (deltablue.js:515:38)
   at chainTest (deltablue.js:807:6)
   at deltaBlue (deltablue.js:879:2)

デフォルトでは、V8から投げられたほぼ全てのエラーはstackプロパティを持ち、上位10のスタックフレームを書式付き文字列の状態で格納しています。こちらが書式付きのスタックトレースの例です:

ReferenceError: FAIL is not defined
   at Constraint.execute (deltablue.js:525:2)
   at Constraint.recalculate (deltablue.js:424:21)
   at Planner.addPropagate (deltablue.js:701:6)
   at Constraint.satisfy (deltablue.js:184:15)
   at Planner.incrementalAdd (deltablue.js:591:21)
   at Constraint.addConstraint (deltablue.js:162:10)
   at Constraint.BinaryConstraint (deltablue.js:346:7)
   at Constraint.EqualityConstraint (deltablue.js:515:38)
   at chainTest (deltablue.js:807:6)
   at deltaBlue (deltablue.js:879:2)

(さらに…)

よく使う括弧の名前(日本語、英語)を調べてみたよ。ブラケット、ブレースとか。

カテゴリー: 未分類
記号 英語 日本語 カーチャンでもわかる
( ) Parentheses 丸括弧 まるかっこ
[ ] Brackets 角括弧 しかくかっこ
{ } Braces 波括弧 にょろかっこ
< > Angle brackets 山括弧 とんがりかっこ
「 」 Angles 鍵括弧 かぎかっこ
【 】 隅付き括弧 見出しのかっこ
⟦ ⟧ Double brackets

その他

  • 括弧全般を指す場合はBracketと呼ぶみたい
  • 上記以外にも呼び方の種類は多い、特に英語
  • 鍵括弧 「 」 はCJK(中日韓)で利用される
  • かつて日本の数学では ( ), { }, [ ] の順に小、中、大括弧と呼ばれていたが、今はそうでもないらしい
    • 世界的には ( ), [ ], { } の順に小、中、大が用いらる場合が多いらしい
    • というか初期以外は丸括弧 ( ) の入れ子で全部表現するようになるよね
  • 一般に使われる山括弧 < > は、実は括弧ではなく数学の大小記号
    • 本来の山括弧 〈 〉 は角度が浅い形をしたもの(フォント)が多そう。たぶん
    • 英語WikipediaでもHTMLタグの山括弧をAngle bracketsと記述しているので、別に混同しても問題なさげ
      • : ” tags enclosed in angle brackets (like <html>)”

出典

新年明けましておめでとうございました。

カテゴリー: 未分類

……え、もう二月ですか!?

というわけで、別段読む価値のない日記です。

昨年末は例年通りひとりAdvent Calendarを開催したのですが、なんと開始数日で止まってしまいました。例年以上に忙しかったというのもあるのですが、それ以上に「何を書いたら良いかわからない」という風になってしまいまして。JavaScript何でもというと何でも書けるんですが、jQueryの記事だとjQueryなAdvent Calendarの方が良いよなーとか、ECMAScriptだったらECMAScriptなAdvent Calendarの方が良いよなーとか、つい考えてしまいました。

一度駄目になるとそこから巻き返すのもまた……。欠番にしてまた他の日付で書けば良かったのですが、どうせなら全部埋めたい、順に書きたいという欲が出てしまいました。でもやっぱり書かなかったのであんな感じです。しょぼーん。

まあいずれにしろ、何かしら理由をつけてサボったというところです。

そんなこんなで一月が終わってしまったのですが、新年明けましておめでとうございました。いい加減に気持ちを改めたいという思いからこの記事を書いております。これからはまた記事を書いてゆきたいなと思っておりますので、本年もよろしくお願い致します。(ネタがないわけじゃあないんですよ……。)

スムーズなアニメーションを実装するコツと仕組みを説明するよ。CPUとGPUを理解しハードウェアアクセラレーションを駆使するのだ!(Frontrend Advent Calendar 2013 – 06日目)

カテゴリー: CSS, JavaScript

この記事はFrontrend Advent Calendar 2013の6日目の記事です。昨日は谷さんWeb Components/Polymerを軽く触ってみるでした。(これ今後数年で大流行りしそうに思うので、未読なら是非!)

さて、最近はHTML5だCSS 3だFlashやめてJS制御でアニメーションだーってんで盛り上がってるわけですが(周回遅れ)、いざアニメーションを実装してみても、なかなかスムーズに動いてくれなかったりしますね。

どうやったらスムーズに動くかってのを解説したいと思います。

なおこの辺りの情報は、概ね斎藤さんを中心としたFrontrend絡みの方々に教えて頂きました。感謝感謝。

先に結論

概念的なの

  • GPU合成レイヤーを適切に使うと早い
    • いわゆるハードウェアアクセラレーション
  • 何がCPUで、何がGPUで描画されるか知っておくべき

実際的なの

  • transformopacityはイケてる
    • 他のアニメーションはコスト高いっぽい、特に色
  • 合成レイヤーの内容を変更しない
  • パラパラアニメは全コマ読み込み可視性の制御で
  • アニメの「コマ」が少なければ少ないほどハードウェアアクセラレーションの効果が出る

ぬるぬるアニメ、ざらざらアニメ

まずは実例からご覧頂きましょう。

(さらに…)