Canvasのイメージ拡大描画について比較してみた - 風と宇宙とプログラム
CanvasのdrawImage APIは下図のように、ソースイメージ中の任意の矩形領域をCanvas領域中の任意の大きさの矩形にマッピングできます。 context.drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh) このAPIによって、イメージの部分領域の縦・横方向の拡大縮小が自由にできるようになっています。 今回は、この拡大機能がちょっと気になったので以下のブラウザの各バージョンで調べてみました。 Firefox Chrome Safari Opera 3.6.11 8.0.552.11 dev 5.0.2 10.63 調べたのは、下のような赤と青が１ピクセル毎に交互に描かれているイメージを拡大したときの補間の表現です。 このイメージを下記表のように拡大してみました。 5倍 10倍 20倍 40倍 80倍 160倍 320倍 640倍 1
HTML5 Canvasのブラウザによって異なる微妙な振る舞いについてまとめてみた。 - 風と宇宙とプログラム
はじめに CanvasはHTML5とは切り離された独立した仕様(HTML Canvas 2D Context)になっているようですが、現状のブラウザ上でのCanvasのについて、普段はあまり気にしない微妙な振る舞いについて調べた結果をまとめてみました。 調べたブラウザの各バージョンは以下の通りです。 Firefox Chrome Safari Opera 3.6.8 6.0.490.1 dev 5.0.1 10.61 線を描く (lineTo) ただの直線を描くだけのlineToですが、その単純なものにも、恐らく、多くの人が普段は気にしないような問題があります。それは座標値とアンチエリアスです。詳しく見る前に、実際の結果を示しましょう。下記のイメージ中に描かれている線は、いずれも線幅(lineWidth)が1の線です。 (左から、Firefox, Chrome, Safari, Opera
1/9801=0.00010203040506070809 - 風と宇宙とプログラム
ハムスター速報(数学にまつわる興味深い話)で知ったのだけど、これは知らなかった。 bcコマンドで200桁まで計算すると、確かに98が抜けているだけで、01 02 03 04 ...と99まで連続している。 % bc -l scale=200 1/9801 .0001020304050607080910111213141516171819202122232425262728293031323\ 33435363738394041424344454647484950515253545556575859606162636465666\ 76869707172737475767778798081828384858687888990919293949596979900 9801というのは(100-1)2であり、同じパターンでもっと大きい数までできる。 % bc -l scale=4000 1/(10
JavaScriptのメソッドコールの仕組みを深く理解する （参照型とは？） - 風と宇宙とプログラム
はじめに JavaScriptでは関数もオブジェクトです。このことはよく理解されていると思います。関数とメソッドとの明確な違いはなく、どちらも関数オブジェクトである、というところまではよいのですが、関数コールとメソッドコールの違い、あるいはその仕組みは正確に理解されているでしょうか。先日、職場の後輩に問題を出したところ正確に答えられえなかったので、いまさら？と思われるかも知れませんが、関数コールの仕組みを解説します。 関数とメソッド JavaScriptでは関数とメソッドには本質的な違いはありません。オブジェクトのプロパティとして定義される関数を便宜的にメソッドと呼んでいるだけです。parseInt()などのグローバル関数もグローバルオブジェクトのプロパティであり、関数の中でローカルに定義した関数も概念的にはActivation Objectのプロパティなので基本的には全ての関数はメソッド
ブログを読むな、マニュアルを読め。 - 風と宇宙とプログラム
プログラムを書くとき、分からない関数を調べるのに、なんでもかんでもブラウザで検索する人をときどき見かける。確かにそれによって目的のものを探すことはできるだろう。ブログには実体験に基づくヒントとなる情報が多いのも確かだ。でもね、そんな検索する時間があったら、手元のmanコマンドを叩けば、もっと正確で詳しい情報が得られる。それをなかなか理解できないプログラマが多くなってきた。
JavaScriptの大きな数と小さな数の仕組みを理解する 〜 IEEE754入門 〜 - 風と宇宙とプログラム
JavaScriptでの数値はIEEE754で規定されている倍精度型doubleです。符号部が１ビット、仮数部が52ビット、指数部が11ビットの64ビットで表現される浮動小数です。この辺りは、計算機の初歩の初歩で、当たり前すぎて普段は気にすることはないと思いますが、その境界値や特殊系について調べるといろいろ面白いことがわかります。ここでは、JavaScriptを例にしていますが、内容は一般的なもので、IEEE754の浮動小数入門的な話です。 では問題です。 整数として正確に表現できる最大の値はいくつか？ 正確に表現できるというのは、n + 1 が確かに n + 1になることとします。n が非常に大きいときには、n + 1 は桁落ちが発生するので n のままです。考える前に実際にやってみましょう。探す n は 0 から 1e+100 の間にあるのは明らかなので、２分法で探索してみます。 fu
JavaScriptのswitch文の速度はブラウザの違いでこんなにも差があった。 - 風と宇宙とプログラム
はじめに JavaScriptのswitch文は、CやJavaと異なりcaseのところに任意の式が書けるため、実行時にcaseの式も評価されるので基本的にはif-else文の並びと類似のものになります。つまり、caseの数に応じてパフォーマンスも低下すると予想されます。本当にそうなのか確認してみました。 測定した各ブラウザのバージョンは以下の通りです。 Firefox Chrome Safari Opera IE 3.5.6 4.0.249.30 4.0.4 (531.21.10) 10.10 8.0.6001 caseが数値リテラルの場合 パフォーマンスを測定するテストコードは下記のような簡単なものです。caseが1000個あるswitch文を10万回繰り返して実行したときの時間を測定しました。perf_test()関数の引数ｖに与える値に応じてcaseの条件で一致する場所が変わります。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
