あらためて理解するArrayBuffer - JavaScriptでバイナリデータを扱う方法 - ICS MEDIA
配列（Array）との比較 JavaScriptにはTypedArrayとは別に配列（Array）の違いを説明します。 ArrayはTypedArrayと比べると柔軟で汎用性が高いです。しかし、Arrayは内部で動的なメモリー管理を行うため、データ処理や転送を高い頻度で行う場合にはオーバーヘッドが発生する可能性があります。 TypedArrayは長さが固定であり、バイト単位のデータ格納が可能なため、メモリーアクセスが効率的に行われます。数値計算においてもバイナリデータを直接操作できるので、高いパフォーマンスが期待できます。また、メモリー領域が連続しているので高速なデータの転送が可能です。 大量のデータを処理する数値計算の場合にはTypedArrayで管理するとデータのまとめた取り回しが楽になります。逆にデータの規模が小さい時は汎用的なArrayが良いでしょう。 TypedArrayは決まっ
ただJSONサイズを80%削減する話
モチベーション HowToだけを知りたい方は読み飛ばしてもOKです。 モチベは次の２つです。 通信量を削減したい！ 難読化したい！ 1. 通信量を削減したい！ 個人開発しているサイトでNetlifyを使っていました。 NetlifyにはFreeのプランがありますが、通信量の制限があります。 個人開発で潤沢にポケットマネーがあるわけではないので、できるだけ通信量のケアをしたい！ 2. 難読化したい！ サーバーからブラウザへJSONを配信すると、JSONの中身が見れてしまいます。 苦労してデータ作ってるので、JSONの中身見られてパクられるのがちょっとなぁ...(※)と思ってました。 nginxのようなミドルウェア層でgzipやBrotli圧縮しても良いのですが、ブラウザのディベロッパーツールで見れちゃったり、よく知られた圧縮方式なのでデコードもしやすいです。 独自の方式で難読化したい！ (※
CodeMirror
Extensible Code Editor CodeMirror is a code editor component for the web. It can be used in websites to implement a text input field with support for many editing features, and has a rich programming interface to allow further extension. This is a CodeMirror field, configured for editing JavaScript code. Features Accessibility Works well with screen readers and keyboard-only users. Mobile Support
C#プログラマーのためのJavaScriptチートシート
タイトルの通り、C#プログラマーのためのJavaScriptチートシートです。C#に慣れているプログラマーがJavaScriptの書き方を効率的に学べるように、2つの言語の書き方をまとめています。 LINQ編は別記事で公開しています。 基本構文 概要 C# JavaScript
TypeScript/JavaScriptの不要なコードを削除するツール「Knip」の紹介 - ベースマキナ エンジニアブログ
こんにちは、taroです！ 今回は、ベースマキナのTypeScriptのプロジェクトで不要なコードの検知・削除で使用しているKnipについて紹介します。 Knip とは Knipは、TypeScript/JavaScriptのコードベースの不要なコードを検出するCLIツールです。 以下が検出できる不要なコードの例です。 package.jsonのdependencies/devDependenciesの中で使われていないpackage exportされているがどこからもimportされていない変数、関数、型など 使用していないファイル その他、検出できる内容の一覧はこちらで確認できます。 またExperimentalな機能（2024年7月現在）として不要なコードの自動削除も可能です。 ちなみにTypeScript/JavaScriptの不要なコードの検出するツールではts-pruneも知ら
【JavaScript】Idle Detection APIとかいう悪用以外の使い道がないAPI - Qiita
2024/09/10にIdle Detection APIというAPIが更新されていました。 ステータスはDraft Community Group Reportです。 これはコミュニティによる提案であり、W3Cによる正式な勧告ではありません。 個人や団体レベルでも、とりあえずRFCを作ってみたり検討したりできる段階ということです。 以下はこの提案を管理しているGitHubから、このRFCの意義を解説したReadmeの紹介です。 User Idle Detection API このAPIでは、開発者はユーザがアイドル状態になったとき(キーボードマウスを操作していない、スクリーンセーバーが起動した、画面がロックした等)のイベントリスナーを登録できます。 入力イベントの監視によるソリューションと異なり、この機能はサイトのコンテンツ領域を超えて機能します。 すなわち、ユーザが別のウィンドウやタブ
リッチテキストエディター（RTE）のJSライブラリ色々試してみた
リッチテキストエディタ(RTE)って？ リッチテキストエディタ（以下RTE）とは、文字を入力できるだけでなく、文字に装飾を加えたり、段落を設定できたりと複雑な機能を持つエディタのことです。 弊社プロダクトであるkintone内にも以下のようなエディタが存在します。 また、似たものを指すWYSIWYG(読み方:ウィジウィグ)という用語もありますが、これはWhat You See Is What You Get（見たままが得られる）の略であり、編集時と出力時の見た目が同じエディタのことを指します。 Zennやesaのように、Markdown記法で編集したものが変換されて表示されるようなエディタは含みません。 このようにWYSIWYGはRTEより狭義の意味になっています。 WYSIWYGエディタ(Google Docs) WYSIWYGではないエディタ（esa） 独自データモデル VS DOMツ
はじめてのインタープリター
インタープリターを書いたことがない方向けに、四則演算といった簡単なものから始め、少しずつ機能を足しながら言語を拡張していくような本です。
JavaScript の組み込み API の Intl が凄いので紹介してみた。
はじめに 明けましておめでとうございます。 (一週間遅れ) この記事はJavaScriptの組み込みAPI Intl の紹介と解説です。 Intl とは？ MDN から引用すると Intl オブジェクトは、 ECMAScript の国際化 API の名前空間で、言語に依存した文字列の比較、数値の書式化と、日付の書式化を提供します。 Intl オブジェクトは、いくつかのコンストラクターに加え、国際化コンストラクターや他の言語に関する関数に共通する機能へのアクセスを提供します 用はi18nの書式版です。 例を出すより見たほうが早いので実際に機能解説します。 (先に言っておきますが、実はこれバックエンド無しで自然言語処理が出来る優れものです。) 用語解説 localesって何？そもそもnewって何？って人がいるかもしれないので locales https://developer.mozilla.
Biome と ESLint の lint ルールの互換性
Biome では、現在約 150 個程度の JavaScript・TypeScript に関する lint ルールを実装しています。 これらのルール多くは既存の ESLint 関連で実装されているルールと同じものになっているのですが、ルールの名前が異なることもあり、その対応関係がわかりにくくなっています。 そこでこの記事では、フロントエンド開発をする場合によく設定していそうな次の lint ルールについて、Biome で実装されているかどうかの対応表を紹介します。 eslint (eslint:recommended) typescript-eslint (plugin:@typescript-eslint/recommended) eslint-plugin-jsx-a11y (plugin:jsx-a11y/recommended) eslint-plugin-react (plugi
GPT-4V: 驚きを隠せない進化！凄すぎて"ズキズキワクワク"が止まりません！！！ - Qiita
この記事で行なっていること 凄すぎて”ズキズキワクワク"が止まりません はじめに ついこの間、ChatGPTは2022年1月までの情報を学習した、というい発表がありましたが、さらに今回のアップデートで 画像解析機能(GPT-4V) が追加され、アップロードした画像を使った新たなタスクの実行が可能になってます。そして、それが凄すぎます 衝撃的な投稿 まずはこちらの衝撃的な投稿をご覧ください。 動画は自転車の画像と共に「サドルを下げる手助けをしてください」で始まります。 ChatGPTからレコメンドが返ってきますが、それに対して、質問者は追加で ポイントになりそうな部分を拡大してアップロード マニュアルと自分の持っているツールの写真もアップロード します。 その結果、その質問者は、サドルを下げることに成功！そんな内容です。 自分の環境で、画像解析機能(GPT-4V)を使えるのか？ さて、画像解
和柄を全集中でかじる本
和柄紋様に全集中するチュートリアルです。 ここでは、使用言語としてJavaScript、 実行環境としてOpenProcessingを利用します。 当該サービスの利用方法については、下記リンクをご参照ください。 [p5.jsをかじる本](https://zenn.dev/sdkfz181tiger/books/6693d767c90588)
やさしくはじめるRemixとWeb
この資料は、2023年4月23日に開催された「春のJavaScript祭り Online 2023」にて発表した資料になります。 https://javascript-fes.doorkeeper.jp/events/154047 Remixとは、2021年にバージョン1.0が登場したフルス…
フロントエンド:単体テストの観点
対象読者 Jest や Testing Library のテストの書き方は理解しているが、何をテストすべきかわからないという方。 動機 近年、フロントエンドでもテストを書くことが重要視されるようになってきました。 テスト導入する際、共通で利用するコンポーネントや関数などをテストする記事は多いですが、何をテストすべきかについての記事が見当たらなかったため、私が意識してるテスト観点を執筆しようと思いました。 まず初めに各種テストの説明 単体テスト 関数やメソッドなどの最小単位の部分を個別にテストする手法のこと。 利用ツール例 Jest React-Testing-Library 結合テスト 複数のコンポーネントが、互いにうまく動作していることをテストする手法のこと。 利用ツール例 Jest React-Testing-Library End to End （E2E）テスト ユーザーが実際にシス
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
UnJSを使って軽率にCLIを作ってみたらめちゃくちゃ便利だった / create CLI with UnJS
数値の文字列をパースしよう
JavaScriptエンジンから見るランタイム / 2024-04-25
GitHub - geolonia/normalize-japanese-addresses: オープンソースの住所正規化ライブラリ。
オブジェクトのクローンにJSON化を使う時代は終わった！【JavaScript】 - Qiita
どこでも動くWebフレームワークをつくる
