タグ

ブックマーク / nmi.jp (12)

  • JavaScript で then を使うのは避けよう(await / async の初級者まとめ)

    JavaScript において、特に苦手とする人が多い印象のある Promise ですが、await と async の文法が導入されたことで、Promise の仕様を深く理解しなくても非同期処理を自然に書けるようになってきたのではないかと思います。 極論ですが、JavaScript の非同期処理は async await new Promise のみで、(ほぼ)全て表現可能です。特別な理由がない限り then を使わないようにしましょう、ということを周知するのがこの記事の目的です。 なお記事では Promise の rejected の状態についてほとんど解説しておりません。基を理解したら、別記事でぜひ学んでみてください。 Promise とは? Promise は、少し乱暴に説明すると「実行が終わっていないかもしれない何らかの関数」を包んだオブジェクトです。 普通の関数とは違って、

    yasu-log
    yasu-log 2024/05/20
  • JavaScript で CPU が Intel かどうかを判定する(ついでに JIT を検知する)

    先日、次のような Tweet を見かけました TIL I discovered that TensorFlow.js uses an interesting trick to sniff your CPU architecture in WebAssembly. pic.twitter.com/LVyywIM48I — Robert Knight (@robknight_) January 4, 2023 面白かったので、なぜこうなるのかの解説と、ついでにこのテクニックを使った JIT 検知方法などについて紹介します。 JavaScript における低レイヤーの扱い JavaScript においては、挙動が比較的しっかりと仕様に定められているために、環境による振る舞いの違いはあまり発生しません。しかし、低レイヤーに降りるほど振る舞いは実装依存になり、環境差が発生する余地が出てきます。 一番

    yasu-log
    yasu-log 2023/01/11
    CPUがx86かarmかどうかはnavigator.userAgentData.getHighEntropyValues()のarchitectureで取得できますが、この記事は違うアプローチなので面白いです。JITの検知もすごい。
  • setTimeout を完璧に理解する

    setTimeout は、指定された時間以降に指定されたコードを実行する JavaScriptAPI です。ブラウザでも Node.js でも広く使われているのですが、実装はまちまちで、色々と特殊な条件も多く、挙動を完璧に理解している人は少ないと思います。この記事では、そんな setTimeout を可能な限り深堀りしてみようと思います。 先に書いておきますが、ものすごくニッチで細かい話ばかり並びます。突然私が、ただ純粋に setTimeout について調べたくなったので、その結果をまとめただけのものです。普通に開発している人には必要のない情報が多くなるでしょう。この記事は基礎から setTimeout を学ぼう、という方には全然向かないと思います。 また、JavaScript のイベントループについてある程度理解していることを前提とします。その詳しい理解には、@PADAone さん

    yasu-log
    yasu-log 2022/11/21
  • WebAssembly を動的生成した場合のパフォーマンスについて

    以下では、それぞれのプログラム実装について詳細を説明していきます。 1. JavaScript simple implementation(js-simple) ソースコード / 実行結果 このプログラムは、JavaScript で BF の文字を 1 文字ずつパースし実行していく、一番シンプルな実装です。対応する括弧のジャンプも、そのたびに愚直に計算して求めています。 一切最適化を施していないため、実行結果はその他のプログラムに比べて一番遅くなっており、各プラットフォームで最も速い結果に比べて 30 倍〜50 倍ほど遅くなっています。 2. JavaScript dynamic-code-creation implementation: single function (js-dcc) ソースコード / 実行結果 このプログラムは、BF の各記号に対応する JavaScript を直接文

  • 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 は文字列を引数にすることを前提にしているため、速度の面でも可読性の面でも「小数値を整数値に変換したい」という場合に使うのは望ましくありません。最も望

  • JavaScript クイズ解説: NaN === NaN の結果はどうなる?

    先日、このようなツイートを書きました。 久しぶりの JavaScript クイズ。 JavaScript において NaN === NaN の結果は次のうちどれになるでしょうか? — Takuo Kihira (@tkihira) September 7, 2021 答えは 4 の「状況によって上記以外もありうる」です。でも、2 や 3 を選んだ方も、もはや正解だといって差し支えないと思います。 解説が長くなったので、ブログ記事にまとめました。 そもそも NaN とは NaN は “Not a Number” を意味する数値です。数値なのに「Not a Number」というのは違和感があるかもしれませんが、数値表現することが出来ない状態を保持するために便宜的に用意された数値、というようなものです。 NaN は、浮動小数点演算において数値では表現出来ない計算をしようとすると登場します。例えば

    yasu-log
    yasu-log 2021/09/09
    【B!】 “undefined と同じく、NaN もコード中に出てきたらバグの発生源になりかねない危険な数値”
  • 10 年前に JavaScript で Flash Player を開発し買収された話

    この記事は、JavaScript で Flash Player の実現を頑張った(もしくは現在進行系で頑張っている)人たちの集う Flash Advent Calendar 2020 に参加しております。 私は過去に自分が設立した会社で ExGame という HTML5 実装の Flash Player(正確には Flash Runtime Engine)を開発し、その会社ごと DeNA に買収(M&A)されました。あまり出来ない体験であるのは間違いないので、Flash が終了を迎える今、改めて振り返ってみようと思います。 Flash Player の開発 今から 10 年前の 2010 年、ちょうど iPhone が普及し始めてきてガラケーのシェアが 8 割から 6 割くらいに落ちようとしていた時期に、私は Flash Player を JavaScript で実装していました。以前この

    yasu-log
    yasu-log 2020/12/24
    DeNA時代の紀平さんの活躍、すごかった
  • 高速化の観点から 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個あるのですが、今回話題にするのは、その中でも「詰まってい

    yasu-log
    yasu-log 2019/06/10
    イミュータブル思考や関数型など、GC起きまくり富豪プログラミングをしているプログラマには、速度の大事さやこの記事のありがたみがわからないのでは
  • Tombo, Inc. をスマートニュース株式会社に売却しました

    昨日ニュースリリースにて発表されましたが、この度 Tombo, Inc. をスマートニュース株式会社に売却しました。 Tombo, Inc. は2014年7月1日にサンフランシスコに設立し、その後4年以上にわたり日アメリカ両方にて活動を重ねてまいりました。関係各所の皆様方にご迷惑ばかりおかけしたことを深く恥じ入るばかりです。当に申し訳ありません。未熟な我々をご支援いただきましたこと、深くお礼を申し上げます。 また売却に対しておめでとうの言葉を頂いた皆様、ありがとうございます。とても嬉しかったです。 Tombo, Inc. 活動の経緯 元々 Tombo, Inc. の目的としては、App Store や Google Play のようなアプリプラットフォームの Web 版を立ち上げることでした。4年前、どれだけ素晴らしい Web アプリを制作したとしても、それを配布する手段が口コミ以外

    yasu-log
    yasu-log 2019/01/09
    【B!】Tombo, Inc. をスマートニュース株式会社に売却しました
  • 生WebGL入門:初音ミクの美麗3Dモデルを表示する(前編)

    Special Thanks to @hagat and @teehah for reviewing my articles! 近年、WebGLに流行の兆しが出てきました。WebGLとは、ブラウザに何らプラグインをインストールすることなく、JavaScriptよりGPUを使用した3Dの表示を可能とする技術です。プラグインのインストールが必要ないとはいえ今までは対応ブラウザが少なくあまり実用的ではありませんでしたが、先日のiOS8で正式に対応されたことでモバイルブラウザにおいて対応率が跳ね上がり、スマートフォンにおいてブラウザベースで3Dのゲーム等を作れる可能性が急激に高まりました。 今回WebGL Advent Calendarの一環として、生WebGLで3Dのオブジェクトを表示するところまで挑戦してみます。WebGLにはthree.jsを始めとして有用なライブラリがたくさんあり、大抵の場

    yasu-log
    yasu-log 2014/12/04
    [B!]生WebGL入門:初音ミクの美麗3Dモデルを表示する - nmi.jp
  • DeNAを退職し、新しく会社を設立します » nmi.jp

    2014年6月末にて、3年間勤めたDeNAを退職する運びとなりました。これから起業し、そちらに注力したいと思います。 私は、2011年7月に、自分の起業した会社が買収される形でDeNAに参加しました。前の会社ではiPhoneでインストールなくFlash Playerを動かす製品を作成し、それがDeNAに高く評価されて買収されました。以後、DeNAでは3年弱にわたり、HTML5総括という立場で社内外でHTML5に関わる様々な活動に参加しました。 ここ数年間の活動を振り返ると、今の日HTML5、特にモバイルHTML5の技術は世界で最も高いと実感しております。そのような恵まれた環境の中でDeNAでは最先端の研究開発をさせていただきました。力及ばずお蔵入りになったり成果が出なかったプロジェクトもあり多数の方々に迷惑をかけてしまいましたが、同僚にも恵まれ、やりたいことを存分に試すことを許していた

    yasu-log
    yasu-log 2014/08/01
    [B!]DeNAを退職し、新しく会社を設立します - nmi.jp
  • JavaScript イディオム集

    JavaScriptでは、初見の人にはさっぱりわからないけれども、ある程度慣れた人は当たり前に使うイディオムが結構たくさんあります。知ってしまえば何てことはないので、私の知っている限りのイディオムとその意味を解説します。 (7/3追記: twitter等で教えていただいた内容を追加しました) +v (数値化) var v = "123"; console.log(+v + 100) // 223 console.log(v + 100) // 123100 vを数値化する方法では最もメジャーです。parseFloat(v) に比べて高速なのに加えて、parseFloatとは細かい挙動が異なります(例えば空文字列の場合、parseFloatならば NaN になりますが、 +v の場合はゼロになります)。必ず数値になることが保証されており、文字列などで数値化出来ない場合はNaNが返ります。 v

    yasu-log
    yasu-log 2013/07/03
    [B!]JavaScript イディオム集 » nmi.jp
  • 1