タグ

ブックマーク / qiita.com/uhyo (7)

  • 【衝撃】React Server Componentsが転送量に与えた驚きの影響とは…… - Qiita

    皆さんこんにちは。最近React界隈を騒がせているReact Server Components (RSC) には、筆者も興味を寄せています。以下の記事でもRSCについて説明しました。 この記事の中で少し言及しているのが転送量の話です。 というのも、RSCの利点として挙げられているもののうち、パフォーマンスに関係するものとしてバンドルサイズの削減があります。つまり、Server Componentはクライアントに送られる前にただのHTMLになってしまうため、コンポーネントの定義を送る必要がない分だけJavaScriptコードの量が減るということです。 しかし、実は話はそう単純ではありません。よくよく考えると、Server ComponentがただのHTMLになると、逆にサイズが増えるということも考えられます。 // Reactコードがこれなのに <Button>click me!</But

    【衝撃】React Server Componentsが転送量に与えた驚きの影響とは…… - Qiita
  • React脳によるUIライブラリ書きやすさランキング - Qiita

    前回のおさらい 前回の記事では、Reactに有利なベンチマークでUIライブラリに競ってもらいました。 こういうベンチマークに対しては、「実務では〜」みたいな反応が一定数出てくるのが自然の摂理です。 書きやすさランキング そこで、シリーズのまとめとして、より実務に近い指標として「書きやすさ」で競ってもらおうと思います。ただし、今回は筆者の独断と偏見によるランキングとなります。せっかく6つのライブラリで同じアプリケーションを書いたので、感想を記事にして残しておきたいという意図です。筆者と同じくReact脳の方にとっては参考になるかもしれません。 なお、前の記事を読んだ方はお分かりの通り、今回書いたアプリケーションはコンポーネントが何個かのものであり、React以外の知識は公式ドキュメントを一通り読んだ程度です。したがって、今回のランキングはコンポーネントの書きやすさに着目しています。大規模開発

    React脳によるUIライブラリ書きやすさランキング - Qiita
  • TypeScriptでMapped Typesを使ってきれいなインターフェースを作る話 - Qiita

    みなさんこんにちは。この記事はTypeScript Advent Calendar 2020の5日目の記事です。 TypeScriptにはintersection typeという機能があります。これはT & Uのような構文をもつ型であり、意味としては「TでもありUでもある型」です。 構造的部分型とIntersection Type 「TでもありUでもある」という説明の仕方をされるとIntersection Typeが何の役に立つのかピンと来ないという方がいるかもしれません。実際のところ、Intersection Typeはオブジェクト型を合体するという役割によく使われます。 例えば、Tが{ foo: string }型でUが{ bar: number }型だった場合、T & Uは実質上{ foo: string; bar: number }型となります。 type T = { foo: s

    TypeScriptでMapped Typesを使ってきれいなインターフェースを作る話 - Qiita
  • そろそろJavaScriptに採用されそうなOptional Chainingを今さら徹底解説 - Qiita

    みなさん、Optional Chaining使ってますか? 私は先日出たTypeScript 3.7 Betaを小さいプロジェクトに導入して使ってみました。これはとても快適ですね。 例によって、Optional ChainingはECMAScriptに対するプロポーザルの一つです。つまり、もうすぐ入りそうなJavaScriptの新機能です。プロポーザルはたくさんの種類がありますが、その中でもOptional Chainingはその高い有用性からこれまで多くの注目を集めてきました。Optional Chainingは2019年6月のTC39ミーティングでStage 3に上昇し、いよいよ正式採用が近く期待も高まってきたところです。TypeScript 3.7にも導入されたため、TypeScriptユーザーの方々は11月上旬に正式リリースが予定されているTypeScript 3.7を今か今かと待

    そろそろJavaScriptに採用されそうなOptional Chainingを今さら徹底解説 - Qiita
  • JavaScriptの等値比較を全部理解する - Qiita

    皆さんこんにちは。今回の記事ではJavaScriptの等値比較について見ていこうと思います。 「どうせ==と===の違いとかだろ? 今さらそんな記事書くなよバーカw」と思った人はぜひ期待せずに読み進めてみてください。 「じゃあObject.isでしょ? 知ってる知ってる、使ったことないけど」と思った人はまあ読まなくても大丈夫です。 さて、等値比較というのは、2つの値が等しいかどうか判定することです。JavaScriptにおいて等値比較はどのように行うのか、そしてどのような場面で等値比較が発生するのかをこの記事では余すことなく紹介します。 以降、この記事で仕様書という場合はECMAScript® 2018 Language Specificationを指すものとします。 ==と=== とはいえ、まずは==と===の話をしないことには始まりません。==はJavaScript初心者がとりあえず習

    JavaScriptの等値比較を全部理解する - Qiita
  • JavaScriptでデッドロックを作ってみた

    いきなりですが、皆さんは排他制御をご存知でしょうか。排他制御は並列コンピューティングにおける概念であり、複数のプロセスが資源を共有して使用する際に、複数のプロセスが同時に資源を使用している状況(競合)が発生しないように制御する手法です。(この分野にはあまり詳しくないのでまさかり等は歓迎します)。 排他制御の一手法としてロックが知られています。この手法では、ある資源を使用するためにはまずその資源のロックを取得する必要があります。そして、資源を使い終わったらロックを解放します。あるプロセスがロックを取得している間は、別のプロセスは同じロックを取得することができません。よって、ロックを取得できたときのみ資源を使用するようにプログラムを書くことによって、資源に対する競合を防ぐことができます。 典型的には、使用したい資源が他のプロセスに使用されている場合、その資源のロックが解放されるまで待つことにな

    JavaScriptでデッドロックを作ってみた
  • まだXMLHttpRequestを使ってるの? fetchのすすめ

    JavaScriptでWeb的なプログラムを書いたことがある人は、XMLHttpRequestを使った経験もあるのではないかと思います。XMLHttpRequest,略してXHRは、JavaScript(+DOM)でサーバーとHTTP通信をするための唯一の方法としての地位を長らく保ってきましたが1、ここ3〜4年でより新しいAPIであるfetch APIが登場しました。fetch APIが出たばかりの頃は何だこのおもちゃはと正直思いましたが、いつの間にか仕様が充実していい感じになっていました。 皆さんは、この新しいAPIであるfetchをちゃんと使っているでしょうか。それとも、古いXHRを未だに使っているのでしょうか。この記事では、未だにfetchを使っていない人を主な対象としてfetchの使い方を解説します。(XHRと比較しながら解説するので$.ajaxとかaxiosとかしか使ったことがな

    まだXMLHttpRequestを使ってるの? fetchのすすめ
  • 1