JavaScriptの歴史については「JavaScript: The First 20 Years」を読む
JavaScript/ECMAScriptというプログラミング言語の歴史について書いた文章はWikipediaなどいろいろなものがあります。 その中でも、ECMAScript 2015のSpec EditorであるAllen Wirfs-Brockによって書かれた”JavaScript: The First 20 Years”が特におすすめです。 JavaScript: The First 20 Years JavaScript: The First 20 Years | Zenodo “JavaScript: The First 20 Years”はHOPL IV - History of Programming Languages向けに書かれたPaperです。 JavaScriptの誕生からECMAScriptの策定、ECMAScript/JavaScript各バージョンでの違い、ブラ
日本政府発のJavaScriptライブラリを勝手にweb標準化するプロジェクト、全角-半角統一コンポーネントのESモジュール/Deno対応版公開
全角半角という言葉は、パソコン普及前夜のワープロ時代の遺物。「住所を全角で入れてください」など、優しくないお願いは排除し、必要な処理はプログラムでしましょう。 日本政府、経済産業省（経産省）から「IMI 情報共有基盤 コンポーネントツール」が発表されました。 5つ星オープンデータの語彙を定める「共通語彙基盤IMI」に関連したオープンソースなJavaScriptで作られたツール群です。 Node.js を前提に作られていますが、ブラウザや Deno で動かしたいので、ひとまず簡単そうな「全角-半角統一コンポーネント」を移植。インストール不要で下記のようにすっきり使えるものができました！(src on GitHub) $ cat > main.mjs import IMIMojiConverter from "https://code4sabae.github.io/imi-moji-conv
決定版！イマドキの ESLint 設定！ | DevelopersIO
2021 年度版は Zenn に書きましたのでご覧ください。 ESLint 設定を作成する技術 そろそろ書かねばな、と思っていたところに必要としてくださる方がいらっしゃることがわかったので書きました。 eslint, eslint-plugin-prettier, typescript-eslintの組み合わせは僕の中では完全に鉄板になったんだけど、「決定版！イマドキのESLint設定！」みたいなタイトルの煽り記事を書く元気はないんだよな…… — なかざん (@Nkzn) June 1, 2020 2020 年 6 月現在のまとめです。 TL;DR 先にベースの完成形となる設定ファイルをおいておきます。 JSON に比べ YAML のほうが記述量が少なく構造が把握しやすいので YAML で書いています。次の内容をプロジェクトのルートディレクトリーに .eslintrc.yml として保存し
Babel 7.10 Ships with Better React Tree-Shaking
Building Inclusive Mini Golf: a Practical Guide to Accessible XR Development Colby Morgan discusses practical strategies and technical examples for building accessible and inclusive XR experiences. Learn about their core design principles, including accessibility at the start, invisible features, simplicity, and layered depth, using Walkabout Mini Golf as a case study.
Frequently asked questions about JavaScript and links
accessibility 10 advanced 195 AMP 13 Android 2 API 7 apps 7 autocomplete 2 beginner 173 CAPTCHA 1 Chrome 2 cms 1 crawling and indexing 158 encryption 3 events 51 feedback and communication 83 forums 5 general tips 90 geotargeting 1 Google Assistant 3 Google I/O 3 Google Images 3 Google News 2 hacked sites 12 hangout 2 hreflang 3 https 5 images 12 intermediate 205 interstitials 1 javascript 8 job s
ESLint v7.0.0 の変更点まとめ - Qiita
overrides: - files: "*.js" extends: my-config-js - files: "*.ts" extends: my-config-ts のような設定がある場合、eslint lib コマンドは lib ディレクトリ内の *.ts ファイルもチェックします。 なお、eslint lib/** のように Glob パターンを指定した場合は今まで通りに動作しますのでご注意ください。overrides 設定にかかわらず Glob パターンにマッチする全てのファイルをチェックします。 プラグイン開発者へ: あなたが管理するプラグインが *.js 以外のファイルを対象にするルールを提供する場合、recommended設定に overrides を追加すると利用者は便利かもしれません。 動作を元に戻したい場合: 今まで通り overrides 設定にかかわらず *.
CSSはもう新種のJavaScript
インクルーシブ HTML＋CSS＆JavaScript（紹介記事）、コーディングWebアクセシビリティ（紹介記事）の著者ヘイドン・ピカリング氏の記事が興味深かったので、紹介します。 CSS: A New Kind Of JavaScript 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 JavaScriptでのスタイル CSS 最後に JavaScriptでのスタイル Web制作に携わっている人は、2つの補完的なテクノロジーに詳しいと思います。1つは文章とその構造のためのHTML、もう1つはインタラクションとスタイルするためのJavaScriptです。 JavaScriptでスタイル？と思ったかもしれません。そうです、あらゆるDOMにおけるノードをサポートしているJavaScriptのstyleプロパティのことです。
This one line of Javascript made FT.com 10 times slower
July 16 2018 The Discovery It started off with an alert, telling us that the error rate for the Front Page application is above the 4% threshold. This had a real impact on our users, with thousands of error pages being shown (somewhat offset by caching in our CDN). Error pages seen by users Looking at the error logs for the app showed that the application didn’t have any data for the top stories.
next.js で作った動的なサイトを CDN で全力でキャッシュさせる - Diary
next.js で作った動的なサイトを CDN で全力でキャッシュさせる というようなことをしたくなることもあると思います。その上で動的なサイトの場合 CDN のキャッシュをリアルタイムで飛ばしたいことも多いかと思いますので、 CDN の選択肢は事実上 fastly 一つということになります。 この時、 next.js なアプリをどこにどうやってデプロイするかが問題になってきます。 1. ZEIT next.js をつくってるところのホスティングサービスで、すごく簡単に使えていいのですが、キャッシュさせようと思うとすごくめんどくさくなります。ZEIT 標準の CDN とキャッシュ機構もありますが使いやすくないですし、 fastly でキャッシュさせるためにカスタムヘッダーを吐かせようとしても now.json とかにゴチャゴチャ書くことになってあまりよろしくない。 ZEIT 自体よく出来て
What’s coming in Babel 8 - LogRocket Blog
LogRocket’s Galileo AI watches every session, surfacing impactful user struggle and key behavior patterns. TC39 (Technical Committee 39 — the institution which standardizes the JavaScript language under the “ECMAScript” specification) published ES2015 version of JavaScript popularly known as ES6. The adoption of ES6 grew among developers but browsers did not support every feature of ES2015, then c
vendor.js の終焉と Granular Chunks - 徒然技術日記
webpack を使った code splitting のベストプラクティスとして，v3 以前の CommonsChunkPlugin の時代から node_modules 以下に置かれている依存ライブラリを vendor.js という単一の chunk にまとめる方法が紹介されていました． これは webpack の公式ドキュメント Caching | webpack や Google の Make use of long-term caching | Web Fundamentals | Google Developers でも説明されている通り，「ライブラリのコードはアプリケーションコードに比べると更新頻度が低い」という仮定のもと vendor.js にライブラリコードを切り出すことで，キャッシュ効率をよくすることが主な目的でした． しかし時は流れ，いつしか「ライブラリのコー
JavaScript のスレッド並列実行環境
これは Chromium Browser アドベントカレンダーの十日目の記事です。本記事では Chromium における JavaScript のスレッド並列実行環境について仕様・実装・API の面から包括的に紹介します。ブラウザの内部実装に興味がある人を対象に、各機能の使い方ではなく実行モデルに焦点を当てて説明しているため、難易度は高いです。使い方を知りたい人は MDN などの記事を読んでください。この記事をきっかけに実装解読に挑戦してみる人が一人でも増えると幸いです。 本記事を書くにあたり、yuki3 さんに多くのコメントをいただき、議論に付き合っていただきました。ありがとうございました。なお、文責はすべて私 (nhiroki) にあります。誤りや補足、質問などは気軽に GitHub Issue もしくは Twitter へお寄せください。 更新履歴 2018/01/15 Layout
CSS versus JavaScript animations | Articles | web.dev
There are two primary ways to create animations on the web: with CSS and with JavaScript. Which one you choose really depends on the other dependencies of your project, and what kinds of effects you're trying to achieve. Summary Use CSS animations for simpler "one-shot" transitions, like toggling UI element states. Use JavaScript animations when you want to have advanced effects like bouncing, sto
Webpack チャンク最適 テクニック - Qiita
ターゲット 巨大なSPAを作ってしまった人へ 巨大なSPAを作らないように気をつけたい人へ 今回はJSだけにフォーカスするが、もっというと、 超速本 を読んでください。 注意：本資料は、webpack チャンクの挙動を概念的に説明することを重視しているので、 webpack の詳細な設定や、出力ファイル名などは実際の処理と一致しない。適宜自分の手元にある設定とすり合わせるように。 昨今のJSビルド問題と、その解決のためのゴール設定 巨大なJS(+最近は in JS された各種SVGやCSS)はダウンロードだけではなく、UIスレッドのCPUをブロックする。 これはとくにCPUが貧弱な端末で体験が悪化する。そしてビルド時間で開発者体験を阻害する。 できれば webpack 推奨の 144kb 以内にしたい…が現実的に難しいので、 せめて 350kb ぐらいに抑えたい。 SPAなら (ローディン
JavaScriptの代替言語、TypeScriptが最有力か
JavaScriptは、Webブラウザで実行されるプログラミング言語として代表的な存在だ。しかし、JavaScriptで大規模アプリケーションを開発するのは難しいとして、代替のプログラミング言語、JavaScript風プログラミング言語、JavaScriptのスーパーセットとして開発されているプログラミング言語が存在している。これらの中からどれを選択すればよいかを判断するのが難しい状況にあるが、多くのユーザーは「TypeScript」を代替言語として使う動きが出てきているようだ。 State of JavaScriptは、2019年におけるJavaScript関連の調査データとして、「The State of JavaScript 2019」を公開した。調査の対象にJavaScriptの代替言語に関するものがあり、他の言語を引き離してTypeScriptが強い人気を示している。 TypeS
フロントエンドエンジニアにとっての2019年。アンケート結果から分析するイマドキのウェブ制作 - ICS MEDIA
ウェブ業界の当たり前だと思っていることでも、同業他社の人には違う常識があるかもしれません。自分が業界多数の傾向と違うところはどこなのか・・・ この連載ではアンケートデータから国内のウェブ業界の傾向を分析します。 連載第5回目となる本記事ではウェブ業界の「フロントエンドエンジニアにとっての2019年」と題してアンケート結果を紹介します。 JSでブラウザ挙動をどうやって防ぐ？ ウェブページでインタラクションを作るときに、ブラウザのデフォルト挙動が邪魔になることがあります。たとえば、aタグのリンクはJavaScriptでキャンセルでき、自前の処理に置き換えることができます。 ブラウザ挙動のキャンセルのやり方にはさまざまな手段があるのですが、主流のやり方はどれでしょうか？ addEventListener()メソッドやonclick属性のイベントについて質問しました。 187票の回答があり「ret
The Cost of Javascript Frameworks - Web Performance Consulting | TimKadlec.com
There is no faster (pun intended) way to slow down a site than to use a bunch of JavaScript. The thing about JavaScript is you end up paying a performance tax no less than four times: The cost of downloading the file on the network The cost of parsing and compiling the uncompressed file once downloaded The cost of executing the JavaScript The memory cost The combination is very expensive. And we a
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript Weekly Issue 491: June 5, 2020
Live Draw Hongkong, Togel HK Pools 2024 | Hasil Result Data Keluaran HK
Understanding Machines: An Open Standard For JavaScript Functions — Smashing Magazine