Immer はどのように実装されているか - カミナシ エンジニアブログ
はじめに こんにちは。カミナシでソフトウェアエンジニアをしている tokuse(@stomy_13) です。 私が所属するチームが開発している現場帳票システム『カミナシ レポート』では、一部のアプリケーションで状態管理ライブラリの Zustand を使用しています。併せて Zustand の Immer middleware も使用しています。開発を進める中で Immer の内部実装を調査する機会がありました。 Immer は React の状態管理や Redux などと組み合わされて使われることが多く、多くの開発者に愛用されています。しかし、その便利さの裏にある仕組みについて詳しく知っている方は意外と多くはないと思います。 この記事では、Immer がどのように実装されているのか、その内部構造や仕組みのコア部分を簡単に解説します。 Immer とは Immer は「不変性を持つデータ構造
JavaScript Temporal is coming | MDN Blog
Implementations of the new JavaScript Temporal object are starting to be shipped in experimental releases of browsers. This is big news for web developers because working with dates and times in JavaScript will be hugely simplified and modernized. Applications that rely on scheduling, internationalization, or time-sensitive data will be able to use built-ins for efficient, precise and consistent d
オラクル、JavaScriptの商標を自主的に手放すつもりはないとDenoに通告
JavaScriptランタイム「Deno」の開発元であるDeno Landが、オラクルが所有する「JavaScript」の商標登録の取り消しを米国特許商標庁に申請した件について、オラクルはJavaScriptの商標を自主的に手放すつもりはないとDeno Landに通告したことを、Deno Landが下記のX/Twitterへのポストで明らかにしました。 #FreeJavaScript update: Oracle has informed us they won’t voluntarily withdraw their trademark on "JavaScript". Next: they’ll file their Answer and we’ll start discovery to show how "JavaScript" is widely recognized as a g
JavaScript 実行エンジン V8 の JIT 出力コードを読んでみよう
Chrome の JavaScript はとても高速なことでも有名ですが、その実行エンジンは V8 と呼ばれます。V8 自体は独立したモジュールであり、Node.js 等にも使われております。 V8 が JavaScript を高速に実行する技術の一つが JIT (Just In Time) コンパイルです（一般的に JIT と呼ばれます）。これは、そのまま実行すると遅い JavaScript を実行中にリアルタイムに直接マシンコードに変換し（これが Just In Time と呼ばれる所以です）、途中からそのコードに入れ替えて実行することで高速化を達成しています。特に何度も実行される関数で効力を発揮します。 JIT という名前は聞いたことがあろうとも、実際に JIT がどのようなコードを実行しているのかを確認する機会は滅多にないでしょう。この記事では、実際に V8 の JIT の出力を確
【JS】「ただの {}（ブロック文）」を使うと嬉しいこと
JavaScript の 「ブロック文」 をご存知でしょうか。 波括弧（ブレース）で囲む、コレです。 if ブロック if () {} や、for ブロック for () {} として目にすることが多いですが、 {} 単体でもブロック文になります。 これだけだとオブジェクトと思ってしまうかもしれませんが、ブロック文になります。 （オブジェクトとブロック文の解釈については javascriptのオブジェクトリテラルは評価されるまでは、あくまでブロック文でしかない - メモを揉め が詳しいです） なんの意味もないように見える「ただの {}（ブロック文）」ですが、意外と便利なことがあるのでこの記事ではそれを紹介します！
JavaScript Visualized - Promise Execution
Promises in JavaScript can seem a bit daunting at first, but understanding what's happening under the hood can make them much more approachable. In this blog post, we'll dive deep into some of the inner workings of promises and explore how they enable non-blocking asynchronous tasks in JavaScript. I'm still working on making this blog better on mobile devices, mobile browsers don't always render t
Optimizing Javascript for fun and for profit
I often feel like javascript code in general runs much slower than it could, simply because it’s not optimized properly. Here is a summary of common optimization techniques I’ve found useful. Note that the tradeoff for performance is often readability, so the question of when to go for performance versus readability is a question left to the reader. I’ll also note that talking about optimization n
HTML, CSS, JavaScriptの標準の仕様書はどこにあるのか
HTML HTMLの仕様策定には複雑な歴史があります。詳細は他の解説記事に譲りますが、簡単に述べるとW3CとWHATWGのダブルスタンダード状態が長い間続いていました。2022年現在はWHATWGによってLiving Standardとしてまとめられた仕様が実質的な標準となっています。Living Standardという名前が示す通り、バージョンはなくエディターによって随時更新されています。 CSS CSSの仕様はW3Cが策定しています。現在は、CSSとして1つの標準仕様があるわけではなく、数多くのモジュールに分かれて標準仕様の策定が進められています。草案、勧告候補などを経て勧告に至るプロセスと、Levelという概念で整理されたバージョン管理が特徴です。年に1度、SnapShotとしてその時点での標準化の概況が公開されています。 JavaScript JavaScriptは主にWebブラウ
ECMAScript® 2016 Language Specification
Toggle shortcuts help? Toggle "can call user code" annotationsu Navigate to/from multipagem Jump to search box/ Toggle pinning of the current clausep Jump to the nth pin1-9 Jump to the 10th pin0 Jump to the most recent link target` Introduction1 Scope+2 Conformance2.1 Example Normative Optional Clause Heading2.2 Example Legacy Clause Heading2.3 Example Legacy Normative Optional Clause Heading3 Nor
JavaScript の組み込み API の Intl が凄いので紹介してみた。
はじめに 明けましておめでとうございます。 (一週間遅れ) この記事はJavaScriptの組み込みAPI Intl の紹介と解説です。 Intl とは？ MDN から引用すると Intl オブジェクトは、 ECMAScript の国際化 API の名前空間で、言語に依存した文字列の比較、数値の書式化と、日付の書式化を提供します。 Intl オブジェクトは、いくつかのコンストラクターに加え、国際化コンストラクターや他の言語に関する関数に共通する機能へのアクセスを提供します 用はi18nの書式版です。 例を出すより見たほうが早いので実際に機能解説します。 (先に言っておきますが、実はこれバックエンド無しで自然言語処理が出来る優れものです。) 用語解説 localesって何？そもそもnewって何？って人がいるかもしれないので locales https://developer.mozilla.
Object.groupBy()
const inventory = [ { name: "asparagus", type: "vegetables", quantity: 9 }, { name: "bananas", type: "fruit", quantity: 5 }, { name: "goat", type: "meat", quantity: 23 }, { name: "cherries", type: "fruit", quantity: 12 }, { name: "fish", type: "meat", quantity: 22 }, ]; const restock = { restock: true }; const sufficient = { restock: false }; const result = Object.groupBy(inventory, ({ quantity })
【JavaScript】range（整数列）の作成方法
所定の回数だけインデクスに応じて何か処理をしてそれぞれの結果を配列にしたいという処理をサクッと書きたいんだけど、 JavaScriptで整数配列を簡単に生成する方法が覚えられなくて毎度ウェブ検索のお世話になっていたので調べた。 結論スプレッドしてmap [...Array(N)].map((_, i) => i) が簡潔さと速度の面でよいと思う。 完 . . （末尾にベンチマークの実行あり） 前書きループを自前で回せば一応できるんだけど、for文を書くのが面倒なのでサクッとmapしたい。 Pythonではrange、Rubyでは...でRangeオブジェクトなるものが簡単に生成できる。 JavaScriptではそのようなものは無いようで、自作する必要がある。 候補実際には整数列を加工した結果を得たいので、rangeの代替を作るだけじゃなくて実際になにか計算させてみる（ここでは自乗i * i
Detecting an "invalid date" Date instance in JavaScript
I'd like to tell the difference between valid and invalid date objects in JS, but couldn't figure out how: var d = new Date("foo"); console.log(d.toString()); // shows 'Invalid Date' console.log(typeof d); // shows 'object' console.log(d instanceof Date); // shows 'true' Any ideas for writing an isValidDate function? Ash recommended Date.parse for parsing date strings, which gives an authoritative
JavaScript で Invalid Date を判定する
はじめに この記事は #EveOneZenn (Everyday One Zenn) vol.07 です。 JavaScript の Date クラスが返す Invalid Date を判定する方法についてまとめます。 （過去に別所で公開していた記事の加筆版です） 前回： Invalid Date とはなにか Invalid Date とは、 JavaScript の Date クラスが返す、不正な日付を生成しようとしたときの値です。
Is there a mechanism to loop x times in ES6 (ECMAScript 6) without mutable variables?
The typical way to loop x times in JavaScript is: for (var i = 0; i < x; i++) doStuff(i); But I don't want to use the ++ operator or have any mutable variables at all. So is there a way, in ES6, to loop x times another way? I love Ruby's mechanism: x.times do |i| do_stuff(i) end Anything similar in JavaScript/ES6? I could kind of cheat and make my own generator: function* times(x) { for (var i = 0
JavaScriptオブジェクトのプロパティアクセスにおけるビッグ・オー
配列に格納しているオブジェクトをその ID で検索するとしたら処理量は（線形探索だろうから）ビッグ・オー記法としては O(n) になるだろう。 const obj = array.find((item) => item.id === id); 配列の数が多くなければそこまで気にしなくて良いかもしれないけど entries.forEach((entry) => { const image = images.find((image) => image.id === entry.id); entry.image = image; }); みたいな感じで、M 個の記事について N 個の画像の中から対象になる画像を選んでプロパティに割り当てるみたいなことをしだすと処理量は O(M*N) となり、パフォーマンスの懸念は大きくなる（image の id と entry の id は同じ値のものが入ると想
JavaScriptでconcatはもう使うべきではないのかもしれない (Kanasansoft Web Lab.)
当エントリーは多くの誤りを含んでいます。参考にされる場合は最後の追記部分まで含めて読まれるようにお願いします。 それなりに慣れているはずのプロのプログラマでも、このような勘違いや大失態をすることがあるという教訓として残すために、エントリーの削除や修正はせずに追記のみに留めておきます。 JavaScriptで、配列に要素を追加するメソッドに、push、unshift、splice、concatがある。このうち、配列の後方に要素を追加するのは、(要素を好きな場所に追加可能なspliceを除くと)pushとconcatの二つである。この二つのメソッドは破壊的/非破壊的の違いがあれ、似たような挙動を示す。
ホームページ- EY-Office
小ネタです、JavaScriptで本日の日付をYYYY-MM-DD形式で得るコードは案外面倒です。 本日2023年4月17日なら 2023-04-17 という文字列を得るコードはRubyならTime.now.strftime("%Y-%m-%d")、Pythonならdatetime.today().strftime("%Y-%m-%d")（importは省略しました）と簡単に書けますが、JavaScriptでは案外面倒なのです。 追記： いくつかの間違いのご指摘がありましたので修正しました（2023-04-19）。 DeepAIが生成した画像です いっけん正しいようで間違ったコード new Date().toISOString().slice(0,10) new Date()で本日の日時を取得します toISOString()メソッドは日時データをISO形式の文字列に変換します、例えば 2
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【JavaScript】ネイティブで集合演算できるようになった - Qiita
「JavaScriptで要素をドラッグして移動する簡単な方法」という記事が初耳だらけだった件 - Qiita
