Meta の新しいリッチテキストエディターフレームワーク Lexical を調べる
Brand-new Rich Text Editor Framework! 先日 Meta から新しいリッチテキストエディターのフレームワーク Lexical の OSS 化が発表されました。 一方で、 Meta が開発していた既存の React 用リッチテキストエディターフレームワーク Draft.js はアーカイブが決定されました。 実は自分は業務で Draft.js をめちゃくちゃ使っていて、発展に期待しつつウォッチしていたので開発が終了してしまうのが非常に残念ではあるのですが、代わりにより高度に抽象化されたフレームワークが公開されたのでこれはマスターするしかありません。 ということで調べたことをまとめていこうと思います。 執筆時点(2022 年 4 月)では正式リリースされていないので、本稿のサンプルコードは参考にならなくなる可能性があります。 概要 エディターを作るためのフレーム
Edge Functionsはブラウザ - laiso
Cloudflare Workers Cloudflare Workersのようなサーバーレスなコンピューティングプラットフォームとしてここ数年活発な「エッジサーバーでプログラムを実行する環境」(呼び方が定まらないので一旦Edge Functionsとする)でアプリケーションを作る*1とブラウザが通信する先にもう1つブラウザが存在するような妙な感じを覚えていた。 例えばNext.jsのAPI Routesなら書いたコードはNode.jsで動くので頭をサーバーサイドモードにすればいいが、Cloudflare Workersで動くエンドポイントを書く時はそうでない…… おまえ、ブラウザなのか？ みたいな でもよく考えたらこれらのプラットフォームはSpiderMonkeyやらV8やらのブラウザと同じJavaScriptエンジンを組み込んだ実行環境を持っていて、APIも環境の制限(TCP接続とかフ
アンサー: named exportは有害なのか - uhyo/blog
こんにちは。ここ数日は、以下の記事が話題になりました。 named exportは有害だと考えられます「named exportは有害」という主張はこれまで常識と思われていたこととは異なるため、界隈のエンジニアからは否定的・懐疑的な意見が見られます。実際、筆者もnamed exportが有害であるとは1ミリグラムも思っていません。 しかし、自分と異なる意見は当然に下等・幼稚なものであるというのは筆者が最も嫌う考え方ですから、このような異なる意見を分析・理解する必要があると思い、アンサー記事という形でまとめました。具体的には、異なる意見に達する理由としては前提が異なることと論理が異なることが主に挙げられます。前提が異なることが分かれば、自分と異なる意見に至った理由を理解でき、場合によっては取り入れることもできます。論理が違うのであれば、それは瑕疵であり指摘しなければいけません。 なお、そもそ
Top JS rich text editor frameworks for 2021
Rich text editors, also known as WYSIWYG (What You See Is What You Get) editors are everywhere - comment sections, forums, online text editors. Whenever you want to go beyond plain <input> or <textarea> and enable visible, interactive formatting in your editor, you have to go the contenteditable route and build a proper rich editor. Thankfully, with the plethora of JavaScript frameworks and librar
Node.js で最近変わりそうな Permission Policy について - from scratch
さてさて、 25日目の Node.js アドベントカレンダーです。もう年の瀬ですね。振り返りシーズンなんで色々書きたかったんですが、ネタを見つけているうちにこの日になってしまいました。 Permission Policy とは Node.js に新しく Permission を提供しようという試みです。元々 Node.js では同じプロセス内で動いてしまえば どんなモジュールであろうと同じ権限で色々できますね。外部ネットワークにアクセスしたり、ファイルを読み書きしたり。 プロセスに元から許可されている権限は全てできてしまいます。これが今まででは普通でしたが、今後はもしかしたら変わるかも？という話です。 権限に関して制限をかけて、拒否させることが可能です。 以下のような要領で拒絶させることができるようになります。 $ node --policy-deny=net 上のオプションでプロセス内の
Avoid Export Default | TypeScript Deep Dive 日本語版
foo.ts(これはあなたのファイルの多くが参照しているものです)から、より多くのものをexportする必要がある場合、import構文をいじくる必要があります。
polyfill を深堀りする - mizdra's blog
この記事ははてなエンジニア Advent Calendar 2020 5日目の記事です。4日目は id:syou6162 さんで、数字のバラ付きを考慮して意思決定する技術でした。 qiita.com developer.hatenastaff.com こんにちは、id:mizdra です。今年新卒としてはてなに入社し、WebアプリケーションエンジニアとしてGigaViewerというマンガビューワーを作っています。 最近のはてな社内では「tech-future」という、様々な技術を見つめ直すワーキンググループを運営しています。この会では、ある技術についての要点をまとめるだけでなく、その技術にまつわる歴史を紐解いて整理し、その上で全体を俯瞰して将来その技術がどういう方向に向かうのかを議論し、未来を予測する手がかりを作る、といった挑戦的な取り組みをしています。既に弊社のエンジニアから「tech-
Moment.js | Docs
Moment.js has been successfully used in millions of projects, and we are happy to have contributed to making date and time better on the web. As of September 2020, Moment gets over 12 million downloads per week! However, Moment was built for the previous era of the JavaScript ecosystem. The modern web looks much different these days. Moment has evolved somewhat over the years, but it has essential
Best of JS
Coming soon! { "projects": [ { "name": "React", "slug": "react", "added_at": "2015-04-25", "description": "The library for web and native user interfaces.", "stars": 227406, "full_name": "facebook/react", "owner_id": "69631", "status": "featured", "tags": [ { "code": "framework", "counter": 50, "description": "Libraries and frameworks to build UI running in the browser", "name": "UI Framework" },
【感想】『JavaScript Primer 迷わないための入門書』でモダンJS再入門 #jsprimer - Rのつく財団入り口
JS完全に理解した……（し て ま せ ん） 見出しはエンジニア界隈でお馴染みのダニング=クルーガー曲線のアレでございます。2020年6月に出たばかりの最新のJS本を読んだので書評です。 570ページ余りの分厚さで電子版もあり。著者はECMAScriptの仕様にも関わっているazuさん、Angular日本ユーザー会代表のSuguru Inatomiさんと強力な布陣。ES2015(ES6)以降も進化を続けるJavaScriptについて、完全にES6をベースにしたモダンな入門書となっています。 コンテンツはGitHubで管理されてオープンソースとして執筆され、様々な人がコントリビュートした結果が反映される面白い作り方になっています。Web版もすべて無料で参照できるのですが、こういう体系的な情報はまとまった本で学ぶことにしているので電子版で読みました。 僕も2017-2018年ごろに掛けてJS＆
[Web フロントエンド] esbuild が爆速すぎて webpack / Rollup にはもう戻れない - 株式会社カブク
TypeScript + Preact + Material UI + material-table で作っている管理画面のビルドツールを Rollup から esbuild に変えたお話です。 2021/01/07 追記 esbuild に新しく CSS ローダーやプラグイン機構が実装されたので紹介記事を書きました！ esbuild の機能が足りないならプラグインを自作すればいいじゃない https://www.kabuku.co.jp/developers/create-your-own-esbuild-plugin はじめに これまでの JavaScript ビルドツールと私 以前は私も定石通り「アプリには webpack、ライブラリには Rollup」をビルドに利用していましたが、近年はアプリのビルドにも Rollup を利用することが多くなり、 webpack を利用することはな
CSS-in-JSパフォーマンスコスト - 緩和戦略
原文(投稿日：2020/01/09)へのリンク CSS-in-JSは、コンポーネントロジックをスタイリングにリンクする方法として、一部のコンテキストで人気になった。Aggelos Arvanitakis氏はCSS-in-JSのコストがもはや無視できない場合について開発者に注意を促し、緩和戦略を提供した。 Arvanitakis氏は記事において、CSS-in-JSがもたらす利点があるものの、一部のアプリケーションでパフォーマンス問題を引き起こす可能性があると主張した。Reactに注目すると、2つの人気のあるCSS-in-JSライブラリ(styled-componentsとemotion)があり、Arvanitakis氏は、CSS-in-JSスタイルだけの差のコードを比較した。以下はスタイルなしバージョンである: import React from 'react'; const NormalD
Case study: Analyzing Notion app performance · PerfPerfPerf
Web performance isn’t going to save you in this crisis. But if you’re building a software product, chances are you’re relatively unaffected. And in this case, having a quick app is more important than ever. Internet is slowing down due to increased demand, and people are holding on to their phones for longer – so if your app is slow, your users will be affected by it. And slow app means worse busi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Notyf: A minimalist JavaScript library for toast notifications.
GitHub - Schniz/fnm: 🚀 Fast and simple Node.js version manager, built in Rust
ULID vs UUID: Sortable Random ID Generators for JavaScript
GitHub - alpinejs/alpine: A rugged, minimal framework for composing JavaScript behavior in your markup.
GitHub - trentm/node-bunyan: a simple and fast JSON logging module for node.js services
GitHub - Hypercontext/linkifyjs: JavaScript plugin for finding links in plain-text and converting them to HTML <a> tags.
GitHub - vitejs/vite: Next generation frontend tooling. It's fast!
