ARM に存在する JavaScript 専用命令「FJCVTZS」を追う（ついでに V8 をビルドする）
前回の記事では、JavaScript の実行エンジン V8 の JIT 出力コードを読んでみました。記事は M1 Mac 上で動かした結果でしたので、ARM アーキテクチャのアセンブラを読むことになりました。 さてそんな ARM アーキテクチャですが、最近の ARM には FJCVTZS という JavaScript 専用の機械語命令があるのをご存知でしょうか？CPU に、特定の言語（それもコンパイラを持たない JavaScript）専用の命令があると知ったとき、私は大いに驚きました（過去にも Jazelle みたいなものはありましたが） 今回は、この FJCVTZS 命令について、実際にどれだけ効果があるのか、V8 をビルドしながら調べてみましょう。 FJCVTZS 命令とは？ FJCVTZS 命令は、Arm v8.3 から導入された JSCVT 命令の一つで、JavaScript の言
JavaScript 実行エンジン V8 の JIT 出力コードを読んでみよう
Chrome の JavaScript はとても高速なことでも有名ですが、その実行エンジンは V8 と呼ばれます。V8 自体は独立したモジュールであり、Node.js 等にも使われております。 V8 が JavaScript を高速に実行する技術の一つが JIT (Just In Time) コンパイルです（一般的に JIT と呼ばれます）。これは、そのまま実行すると遅い JavaScript を実行中にリアルタイムに直接マシンコードに変換し（これが Just In Time と呼ばれる所以です）、途中からそのコードに入れ替えて実行することで高速化を達成しています。特に何度も実行される関数で効力を発揮します。 JIT という名前は聞いたことがあろうとも、実際に JIT がどのようなコードを実行しているのかを確認する機会は滅多にないでしょう。この記事では、実際に V8 の JIT の出力を確
setTimeout を完璧に理解する
setTimeout は、指定された時間以降に指定されたコードを実行する JavaScript の API です。ブラウザでも Node.js でも広く使われているのですが、実装はまちまちで、色々と特殊な条件も多く、挙動を完璧に理解している人は少ないと思います。この記事では、そんな setTimeout を可能な限り深堀りしてみようと思います。 先に書いておきますが、ものすごくニッチで細かい話ばかり並びます。突然私が、ただ純粋に setTimeout について調べたくなったので、その結果をまとめただけのものです。普通に開発している人には必要のない情報が多くなるでしょう。この記事は基礎から setTimeout を学ぼう、という方には全然向かないと思います。 また、JavaScript のイベントループについてある程度理解していることを前提とします。その詳しい理解には、@PADAone さん
Chrome の console.log でハマらないために
JavaScript を書いたことがある人ならば一度は使うであろう console.log ですが、この関数は思ったよりも厄介な性質を持っています。その性質を知らずに console.log を使うと、デバッグ時に大ハマリしてしまうことがあります。この記事では console.log の落とし穴についてお話します。 今回は Chrome に特化して解説しますが、Firefox や Safari でも同じ落とし穴があります。 console.log とは まずはさらっと基本をおさらいしましょう。 大前提なのですが、console.log は JavaScript の言語仕様（ECMAScript）で定義されていません。ブラウザ向けには whatwg の仕様がありますが、あくまでもそれはブラウザ向けの仕様であり、Node.js を含むほぼ全ての JavaScript 環境で使えるのは cons
JavaScript の undefined と null を完全に理解する
JavaScript で頻出する undefined と null について語ります。 言語仕様上の違い JavaScript (ECMAScript) において、仕様上 undefined と null は当然ながら明確に区別されています。いくつか言語仕様上の扱いについて挙げてみます。 比較 厳密な比較演算子 === において undefined と null は区別されます。ゆるい比較演算子 == においては両者は区別されません（仕様 7.2.14）。 console.log(undefined === null); // false console.log(undefined == null); // true 他の falsy な値（false とみなされる値）との比較は、ゆるい比較演算子であっても区別されます（仕様 同上）。 console.log(undefined == fa
正規表現の脆弱性 (ReDoS) を JavaScript で学ぶ
先日、このようなツイートを書いたところ、かなりの反響がありました。 JavaScript の正規表現の脆弱性の例でいうと、例えば /\s+$/ は脆弱性があると言える console.time(); /\s+$/.test(" ".repeat(65536) + "a"); console.timeEnd(); 結構時間がかかるのがわかる。でも /\s+$/ を見て「これは危険だな」と理解出来る人はそんなにいない。JavaScript に限らないけれど。 — Takuo Kihira (@tkihira) February 17, 2022 これは一般に ReDoS (Regular expression Denial of Service) と呼ばれる脆弱性です。正確に理解するのが難しい脆弱性なので、少し解説してみたいと思います。 結論 長い記事になるので、最初に「とりあえずこれだけ知っ
JavaScript で parseInt / parseFloat を使わない方が良い理由
となるのが原因です。parseInt というのは、文字列を解析して整数値（int）を返すグローバル関数であり、引数をまず文字列に変換する仕様となっております。その段階で 0.0000005 が "5e-7" という文字列に変換されてしまい、その文字列の先頭の 5 だけが数字として解析されてしまったため、結果として parseInt(0.0000005) === 5 となりました。 なぜ String(0.000005) === "0.000005" に、String(0.0000005) === "5e-7" になるのかについては、この記事の最後で余談として説明します。 整数化には Math.trunc を使おう このように、parseInt は文字列を引数にすることを前提にしているため、速度の面でも可読性の面でも「小数値を整数値に変換したい」という場合に使うのは望ましくありません。最も望
高速化の観点から new Array(100) を使わない方が良い理由
別件で V8 の JIT コードの逆アセンブルを眺めている時に気づいたのですが、JavaScriptで new Array(100) という形で配列を作るのは、高速化の観点から言うと V8 においては避けるべき書き方です。 高速化を求める方は、 new Array() や [] で作成して Array#push で追加していくのが良いでしょう。この記事では、その理由を説明します。 今回の記事は、以下の V8 のブログ記事を参考にしております。 https://v8.dev/blog/elements-kinds 「詰まった配列(Packed Array)」と「穴あき配列(Holey Array)」 v8 は内部的に、その配列がどういうタイプの配列であるかの状態を記録しており、その情報を利用して最適化を適用します。状態は内部的には21個あるのですが、今回話題にするのは、その中でも「詰まってい
DeNAを退職し、新しく会社を設立します » nmi.jp
2014年6月末にて、3年間勤めたDeNAを退職する運びとなりました。これから起業し、そちらに注力したいと思います。 私は、2011年7月に、自分の起業した会社が買収される形でDeNAに参加しました。前の会社ではiPhoneでインストールなくFlash Playerを動かす製品を作成し、それがDeNAに高く評価されて買収されました。以後、DeNAでは3年弱にわたり、HTML5総括という立場で社内外でHTML5に関わる様々な活動に参加しました。 ここ数年間の活動を振り返ると、今の日本のHTML5、特にモバイルHTML5の技術は世界で最も高いと実感しております。そのような恵まれた環境の中でDeNAでは最先端の研究開発をさせていただきました。力及ばずお蔵入りになったり成果が出なかったプロジェクトもあり多数の方々に迷惑をかけてしまいましたが、同僚にも恵まれ、やりたいことを存分に試すことを許していた
DeNAで働き始めて2年半が経ちました
2014年が今日から始まりました。どうぞ皆様、今年もよろしくお願いします。 さて2014年1月1日で、DeNAで働き始めてからちょうど2年半が経過したことになりました。2年半というのは私にとって大きなマイルストーンとなりますので、それについて語ってみたいと思います。 今私はDeNAでHTML5総括という立場を名乗っておりますが、その前は「株式会社ブロードテイル」という会社を設立し、その代表取締役をしておりました。設立は2008年3月26日、今から6年前ですね。当時普及していたフィーチャーフォン（ガラケー）のFlash Liteを利用し、携帯上でインストールなくプログラムを実行可能にするフレームワークを作成・販売しておりました。 その会社で2011年の11月に開発を始めたのが、「ExGame」というiPhoneのブラウザ上でFlashを再生するためのミドルウェアツールでした。この開発に関わる
JavaScriptでアニメーションを書く初歩の初歩
JavaScriptを使ってアニメーションを書くときに有用なテクニックの、基本中の基本をご紹介します。おそらく、このブログを見ている人のほとんどにとっては釈迦に説法だと思います。今回、requestAnimationFrameの話すらしません。その点、ご留意ください。 まず、JavaScriptでアニメーションをする場合に気をつけないといけないのが、一度JavaScriptの実行（Context）を抜けないとブラウザに描画が反映されないということです。簡単に言うと、 <html><head><title>bad sample</title><script> onload = function() { var e = document.getElementById("e"); for(var i = 0; i <= 100; i += 5) { e.style.left = e.style.
戻るボタンが押された際、ページのJavaScriptを途中の状態から実行させない方法
スマートフォンを含む最近のブラウザでは、戻るボタンで前のページに戻った際に、JavaScriptも含めて前回の最後の状態を復元します（Back Forward Cacheと呼ばれます）。これはとても便利なのですが、ページを作成する立場からすれば、余計なお世話であることもあります。 Back Forward Cacheの無効化はとても簡単に実現できます。ページの中にonunloadを書くだけです。 <!DOCTYPE html> <html><head><title>onunload test</title> <script> window.onunload = function() {}; window.onload = function() { var count = 0; var loop = function() { document.getElementById("num").in
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
