Web Scratch

フィード

記事のアイキャッチ画像
JavaScript PrimerのES2024対応を手伝ってくれるContributorとSponsorを募集しています
Web Scratch
JavaScript PrimerのES2024の対応を進めていく予定なので、対応を手伝ってくれるContributorとjsprimerというプロジェクトを支援してくれるSponsorを募集しています。追記(2024-03-22): Contributorを希望する方は集まりました。ありがとうございます!JavaScript Primerスポンサーは引き続き募集しています!Gold SponsorsSupporters3行サマリーES2024の対応を6月末までにやるマイルストーンを切りましたES2024の対応を手伝ってくれるContributorを募集していますOpen Collectiveを始めたので、プロジェクトを支援してくれるSponsorを募集していますjsprimerのES2024対応jsprimerは毎年のECMAScriptの仕様改定にあわせてメジャーアップデートを行なっています。次の更新は、2024年6月末ごろにリリースされる予定のECMAScript 2024に対応する予定です。そのため、ES2024の対応とユースケースであるNode.jsに関するアップデートをしていくマイルストーンを切りました。v6(ES2024) MilestoneES2024に対応するマイルストーンをざっとみると、大体ざっくり12-20日分ぐらいのタスクがあります。大きく分けて次の3つのグループに分かれています。ES2024の対応Stage 2.7の追加Node.jsのユースケースの更新ES2024の対応ES2024ではいくつか機能が増えているので、それに対応するアップデートを行います。ECMAScript 2024の対応 · Issue #1706というIssueに、ES2024の対応についてのタスクをまとめています。具体的に対応したいIssueは次の3つになっています。ES2024: array-grouping · Issue #1716ES2024: Well-Formed Unicode Strings · Issue #1715ES2022: Error Cause · Issue #1714Array Groupingは恐らく対応が必須ですが、他の2つは必要なら対応する形になると思います。実際に内容や入れる場所を考えてみて、それが読む人にとってほんとに必要な情
2ヶ月前
記事のアイキャッチ画像
Kagi Searchをメインの検索エンジンとして使っている
Web Scratch
最近はGoogleではなくKagi Searchをメインの検索エンジンとして使っています。Kagi Searchは$108/year($10/month)の有料の検索エンジンです。広告モデルではない検索エンジンなので、有料のサブスクリプションモデルとなっています。Plan Types | Kagi’s Docsいくつかプランがあり、検索し放題のProfessionalプランが$10/monthですUltimate Plan ($25/month)だと外部のOpenAIのGPT 4とかClaude 3との連携とかも入ってきます月に1-2万回ぐらいは検索することを考えると、 (108 / (10000 * 12)) * 150 で大体1検索が0.1円ぐらいのイメージですが、こちらもKagiのLLM機能は利用できるので、実質もう少しコスパは良いと思います。検索ソースにはGoogle, Yandex, Mojeek, Braveなどのリソースを使っているので、検索結果自体はGoogleとそこまで変わらないと思います。Search Sources | Kagi’s Docs基本的な使い方ではGoogleで見つかったものがKagiで見つからなかったという経験はありません。もちろん、検索の量でGoogleより優れたものはないと思うので、量にフォーカスしたいときはGoogleを使えば良いと思います(逆に今は飽和的になって検索が逆に難しかったり、検索されてないところにコンテンツがあったりして、量でのカバーは難しい感じはします)自分がKagiを使う一番理由は検索体験にあると思っています。いいところGoogleより良いと感じる検索結果が出しやすい(人による)日本語の検索結果はそこまで変わらない感じもする(後述する漢字だけ検索した時の問題はまだある)フィルター系がビルトインであるので、絞り込みはしやすく感じる英語で検索した時に英語のリソースにマッチさせやすいので良い結果と感じることが多いたとえば、Googleだと英語で検索して”英語のページを検索”を選択にしても、日本語のサイトが出てくる(おそらくRegionが日本だと、日本語訳があったらそっちを出すみたいな感じになったりして、これが嫌なこと多い)https://www.google.com/search?q=javascript&lr=l
2ヶ月前
記事のアイキャッチ画像
Twitter/Blueskyの自己ポストの全文検索サービスをNext.js App Router(RSC)で書きなおした方法/設計/感想
Web Scratch
mytweetsという自分の Twitter/Bluesky の自己ポストの全部検索サービスをNext.js App Router(RSC)で書きなおしました。mytweets は Twitter のアーカイブや Bluesky の API を使って自分のポストを S3 に保存しておき、S3 Selectを使って全文検索ができる自分専用の Twilog のようなサービスです。自分の Tweets をインクリメンタル検索できるサービス作成キット と Tweets をまとめて削除するツールを書いた | Web Scratch過去の Tweets を全文検索できる mytweets を Bluesky に対応した。自分用 Twilog みたいなもの | Web Scratch最初は CloudFront + Lambda@Edge + Next.js Pages Router で動かしていました。その後、Next.js App Router が Stable になったので、App Router + React Server Components(RSC)で書きなおしました。この記事では、Next.js Pages Router から Next.js App Router(RSC)に書きなおした話を紹介します。ただし、この記事は発散的な内容になっているのと、あまり正確性が保証されてないので、個人的なメモ書きとして読んでください。あまりにも長くなったので、あんまり読みやすくは書けませんでした。📝 キャッシュとメモ化については特に触れていません。mytweets の動作mytweets は、次のような動作をします。クエリがない場合は、S3 Select から最新のポストを取得して表示クエリを入力したら、S3 Select の API を使って全文検索を行い、結果を表示この動画は、App Router + React Server Components(RSC)で動かしてるものを録画したものです。表示的にファーストビューが出てからローディングが走って、結果を取得してポストを表示するという動作をしているので一般的なSPA (Single-page application)っぽく見えます。実際のコードベース上では、クライアント側には Fetch API などは書いていません。初期化...
3ヶ月前
記事のアイキャッチ画像
歩いて読書する
Web Scratch
最近よく歩きながら読書しているので、そのメモ書きです。必要なもの人とぶつからない幅の歩行者用道路スマートフォン川沿いは、人が少なく歩きやすい道が多い。方法スマホで本を開いて読みながら歩く物理的な本は片手だと読みにくいので、自分はスマホで読んでいます。iPhoneみたいなサイズでも、レスポンシブな本なら問題なく読めます。最近は慣れすぎて、PCのようなモニタサイズがでかいと逆に読みにくく感じます(技術書とかは別ですが)。KindleやKoboやO’Reillyなどのアプリは大体片手でも扱えます。その他だと、自分の場合はmubook-honを作って使ってます。mubook-hon: Dropboxに保存したepubやPDFを読むビューア、Notionにメモや読んでいる位置を記録できるMobile/PC対応のウェブアプリ | Web Scratchいいところ本を読みながら歩くと距離を意識しなくなるので、想像より長く歩けたりします(本が面白いほど歩ける)。季節的に秋から春ぐらいが良くて、自分の場合は冬で寒くなってから歩く距離が増えてる気がします。自分の場合は、大体5-10kmぐらい散歩しながら読んでいて、大体2回の散歩で一冊読み終わるぐらいのペースで読んでいます。近く(近くはないけど)に図書館があるので、図書館まで歩きながらスマホで本を読んで、図書館で目に入った本を数冊読んで、また読みながら歩いて帰るということをよくしています。図書館でウィンドウショッピングして、その場で買って帰りながら読めるのもいい点です。わるいところ歩きながら読むのに向いてない本をあんまり読まなくなる。具体的にはPDFは読みにくいので、読むのを避けるようになりました。まとめ歩きながら読書すると、本を読む時間が増えるのでおすすめです。以前から歩きながら考えたりや本を読むタイプだったのですが、最近は本を読むために歩いてる感じはします。歩きながら考えを書き出すのも、最近だとiOSの音声入力やWhisperベースのアプリなどを使うと、結構雑に書けるので便利です。superwhisperでの音声入力を試す | Web ScratchiOSアプリもある: superwhisper最近は歩きながらコードを書く方法はないかなーと考えています。
3ヶ月前
記事のアイキャッチ画像
私のJavaScriptの情報収集法 2024年版
Web Scratch
個人的なJavaScriptの情報収集の方法についてまとめてみます。JSer.infoなどをやっているので、JavaScriptの情報については色々な情報源を見るようにしています。JSer.infoの範囲の中での情報源については、次の記事でまとめています。JSer.info 13周年: JavaScriptの情報源を整理する - JSer.infoこの記事では、少しスコープを広げてJavaScriptの情報収集についてまとめてみます。かなりスコープが広がってしまうので、万人向けの方法ではなく、個人的な情報収集方法としてまとめています。この記事では、膨大な情報の中から見つけるというアプローチをとっているので、人によって向き不向きがあると思います。情報収集の方法情報の元となる情報源はさまざまなサイトや人になると思います。しかし、そのサイトや人ごとに見ていくというのはかなり大変で、それ自体が大変になると見なくなる可能性が高いと思います。そのため、情報収集においては、情報を自分が見やすいと思える場所に集めることが重要だと考えています。人によってこの集める場所は異なりため、Twitter(X)、RSSリーダー、Notion、SlackやDiscordなど色々な場所があると思います。自分の場合はRSSリーダーに情報が集まるようにしています。RSSリーダー技術的なサイトにはRSSフィードがついてることが多いので、自分はRSSリーダーにRSSフィードを集約しています。また、後述しますがRSSフィードがないものも、欲しい情報源からRSSフィードを作るなどとしてRSSリーダーに集約しています。RSSリーダーにはInoreaderを利用しています。InoreaderのフロントエンドとしてIrodrを使っています。LDRライクなRSSリーダのIrodr 1.0.0をリリースした | Web ScratchかつてのLDRと同じ操作方法を実現、新しい国産RSSリーダー「Irodr」が登場【やじうまWatch】 - INTERNET Watch自分の情報収集はメモまでがセットなので、RSSは基本的にPCでしか見ていません。スマホで見つけたものに関しては、Pocketにあとで読む登録して、PocketのRSSフィードを購読しているので、それをPCで見るようにしています。(最近音声メモも結構やり始め
3ヶ月前
記事のアイキャッチ画像
#jsprimer week: 2024-02-05 - 2024-02-11
Web Scratch
先週のtextlint weekに引き続き、今週はjsprimerの開発に集中するjsprimer weekです。目標としては、次のECMAScript仕様であるES2024に入るProposalが今週のTC39ミーティングで確定するので、それに合わせてjsprimerをどう更新するかを決めることです。ECMAScript 2024の対応 · Issue #1706 · asciidwango/js-primerES2024の変更はそこまで大きなものはこなさそうなので大丈夫そうですが、Node.jsの変更が多くなってるのでNode.jsでCLIアプリ · JavaScript Primer #jsprimerをどうするかをちょっと考えたいです。markedjs v8へのアップデート · Issue #1694 · asciidwango/js-primerutils.parseArgsの利用法を追記 · Issue #1698 · asciidwango/js-primerまた、企業でjsprimerの更新を支援できる仕組みとしてJavaScript Primer - Open Collectiveを作ってありますが、まだちゃんと運用できてないので、運用できるようにしたいです。Open Source Collective · Issue #1674 · asciidwango/js-primerOpen Collectiveの資金を使って、jsprimerの更新を手伝ってくれた方にもちゃんと労力にあった報酬を支払えるようにしたいです。jsprimerの更新に興味があるって人は、それとなくコメントしてくれると嬉しいです。ECMAScript 2024の対応 · Issue #1706 · asciidwango/js-primerECMAScriptに合わせた更新は毎年やっているので、どういうことをやってるかは次のIssueを見るとイメージできると思います。今年は、Array.groupByの更新ぐらいな気はしているので、そこまで大きな変更はないと思います。どちらかというとNode.jsに関する更新は、どう変えると読みやすいかは考える必要がありそうです。ECMAScript 2023の対応 · Issue #1658 · asciidwango/js-primerEC
3ヶ月前
記事のアイキャッチ画像
Node.jsで機能やパッケージの非推奨メッセージを通知する方法
Web Scratch
ライブラリやツールなどを作っているときに、特定の機能やパッケージを非推奨にする場合があります。これらの非推奨はリポジトリ上のREADMEやIssueなどに書いても、利用者が気づかないことがあります。そのため、利用者が気付けるように非推奨の機能やパッケージを使った場合に警告を出す方法を紹介します。非推奨にはいくつかの段階があり、それに応じてやり方を変えられるので、それぞれの方法を紹介します。パッケージの非推奨化: npm deprecate <package> <message>コードレベルの非推奨化: JSDocタグの@deprecated実行時の非推奨化: process.emitWarning()パッケージの非推奨化: npm deprecate <package> <message>npmのパッケージレベルで、そのパッケージが非推奨であることを通知するにはnpm deprecateコマンドを使います。npm-deprecatenpm deprecate <package> <message><package>には非推奨にするパッケージ名を指定します。<message>には非推奨にする理由を書きます。@azu/test-packageパッケージを非推奨にする場合は次のようにします。npm deprecate @azu/test-package "@azu/test-package is deprecated. use new-someting instead." 非推奨とするパッケージのバージョンを指定することもできます。npm deprecate @azu/[email protected] "@azu/[email protected] is deprecated. use new-someting instead." npm deprecateコマンドで非推奨にしたパッケージは、インストールしようとしたときに警告が表示されます。$ npm install @azu/test-packagenpm WARN deprecated @azu/[email protected]: @azu/test-package is deprecated. use new-someting instead.added 1 package in 1sまた、npmのウェブサイト上
4ヶ月前
記事のアイキャッチ画像
textlint v14をリリースしました
Web Scratch
textlint v14.0.0をリリースしました!リリースノート: textlint v14.0.0 · textlint変更ログ: Release v14.0.0 · textlint/textlinttextlint v14.0.0は、Node.js v18.14.0以降が必要になります。Node.js 16は既にEOLなので、Node.js 16のサポートを終了しました。古いNode.jsを使っている場合は、LTS(Long Term Support)版のNode.jsにアップグレードする必要があります。Download | Node.jsユーザー向けの変更点基本的にはNode.jsのバージョンが18以降なら、特に影響がある変更はありません。Node.js 16のサポートを終了textlint v14はNode.js v18.14.0+が必要です。Node.js 18か20にアップグレードする必要があります。Download | Node.jsまた、ルールを開発する人向けのパッケージであるtextlint-scriptsはNode.js v18.19.0+を必要としています(最新のNode.js 18 LTSバージョン)。gulp-textlintをmonorepoから分離gulp-textlintをmonorepoから分離しました。chore!: move gulp-textlint to out of monorepo by azu · Pull Request #1319 · textlint/textlinttextlint/gulp-textlintgulp-textlint はtextlintコアチームによってメンテナンスされていません。リポジトリとして分けたので、興味がある人は以下のIssueをチェックしてください。Looking for new maintainers · Issue #12 · textlint/gulp-textlint--parallel と --maxConcurrency フラグを削除textlint v14では、実験的であった--parallel と --maxConcurrency フラグを削除しました。これらのフラグは並列処理をするためのものでしたが、あまり使われていなかったためです。# これらのフラグは削除さ
4ヶ月前
記事のアイキャッチ画像
textlint week: 2024-01-29 〜 2024-02-04
Web Scratch
今週は、textlintの開発に集中する textlint week です。目標としては次のメージャーバージョンであるv14をリリースすることです。v14 roadmap · Issue #1200 · textlint/textlintv14では、今後に向けて古いAPIに非推奨のメッセージを出すことや、使われなくなってるオプションなどを削除するといった変更を入れる予定です。これに合わせて不要な依存などを減らしていっています。そのため、ほとんどのユーザーには特に影響はないと思います。textlint weekで時間があれば、次のようなことをやっていきたいです。Office Hoursをやる?聞きたいこととか、質問したいこととか、相談したいこととか話す場所editorのアップデート?process.emitWarning(warning[, options])を使った非推奨アプローチについての記事を書くEdit: textlint weekの結果textlint v14をリリースしました | Web ScratchNode.jsで機能やパッケージの非推奨メッセージを通知する方法 | Web Scratchv14のリリース後に新しい機能改善などもしていきたいので、フィードバックをお待ちしています。次のフォームからフィードバックを送ることができるので、是非お願いします!var d=document,w="https://tally.so/widgets/embed.js",v=function(){"undefined"!=typeof Tally?Tally.loadEmbeds():d.querySelectorAll("iframe[data-tally-src]:not([src])").forEach((function(e){e.src=e.dataset.tallySrc}))};if("undefined"!=typeof Tally)v();else if(d.querySelector('script[src="'+w+'"]')==null){var s=d.createElement("script");s.src=w,s.onload=v,s.onerror=v,d.body.appendChild(s);}textlint notes📝 Ma...
4ヶ月前
記事のアイキャッチ画像
superwhisperでの音声入力を試す
Web Scratch
superwhisperという、whisper.cppを使った音声入力ができるmacOSアプリケーションを最近使っています。基本的にはggerganov/whisper.cppのモデルを使って、音声認識しながら文字入力ができるアプリケーションです。特徴Whisperの認識精度が高いかなり早く喋っても認識してくれる日本語も認識してくれるモデルがある日本語で喋って英語に翻訳してくれる機能もあるオフライン対応有料: サブスク と 買い切り の2種類のプランがある無料で15分のトライアル、その後は選べるモデルが制限される公式サイトのデモをみると、かなり早く喋っても認識してくれるのがわかります。大抵の人にとっては、多分文字入力するよりしゃべったほうが早いぐらいの入力速度が出ると思います。superwhisper長文はそこまで得意じゃないけど、1行とか2行ぐらいの文章はかなり早く入力できるんじゃないかなって気がします。句読点とかは勝手に入れてくれるので、適当にしゃべっても、ある程度文章っぽい文章になると思います。認識の精度はMacBook Airの本体のマイクを使っても普通に認識してくれます。それでいて、間違いもそこまで多くないのでかなり実用的です。(単語とかはたまに怪しいが文字列置換機能を辞書的に使える)大体1-2行のテキストだとMacBook Air M2で2~3秒ぐらいの認識速度です。文章の量が多くなるほど、認識時間が長くなるのでこの辺はまだ長文に向いてないのかなという印象です。(Realtimeモードがあるので、この辺はインクリメンタルな結果を合成すればかなり早くなりそうな気はします)使い方基本的には、superwhisperのサイトからダウンロードして、起動するだけです。使い方は単純で、使いたいモデルを選択して、起動すると音声認識が始まるので喋るだけです。認識した結果はクリップボードにコピーするか、そのままペーストするか、実験的な機能としては文字入力を再現する機能もあります。設定は、認識するモデルや喋る言語、認識した結果を英語に翻訳するかなどが選べます。またリアルタイムでその認識した結果を出してくれるか、とかいう設定があります。モデルはWisperのモデルを使っているので、基本的に認識精度とその認識した結果を変換する時間とのトレードオフでモデルを選ぶ感じです。gger
4ヶ月前