XMLHttpRequest とはなんだったのか | blog.jxck.io
Intro Fetch API の実装が広まり、 IE もリタイアを迎えたことで、今後忘れ去られていくことになるだろう XMLHttpRequest について。 どのように始まり、どのように広まり、どのように使われなくなっていくのか。その間に残した多大な功績を残す。 XMLHttpRequest の始まり この名前は非常に長いため、通常 XHR と略される。 この API は、現在の Web API のように W3C/WHATWG による標準化を経て策定された API ではない。 Microsoft によるいわゆる独自実装の API として始まり、後追いで標準化される。 したがって、 Web API の中でもかなり異質な命名である XHR が、 XmlHttpRequest でも XMLHTTPRequest でもなく XMLHttpRequest である理由も、 Microsoft の命
WASMとRustはVue.js/React.jsを打倒するのか？ - JSへの侵略の歴史
はじめに 「Typescriptの次はRustかもしれない」という記事がバズってるのを見かけました。 なかなか面白くて、PAとしてのWASMとRustを比較している記事です。ちょうど最近「レガシーおじさん、SPAを始めてみた。そして限界を知る」でも書いた通り最近SPAに手を出してみたのですが、いろいろやろうとするとSSRのためのBackend for Frontend (BFF)等が必要になるとわかり「これJSでやる必要なくない？」とも感じていたのでちょうど良かったです。 こういうのを見るとRIAやGWTのように似たアプローチで廃れた技術や、登場が早すぎたMeteor、今も頑張ってるMSのBlazorなど色々頭をよぎります。といわけで歴史を俯瞰する意味でHTML + JavaScriptとそれ以外の技術のせめぎ合いの歴史やMSのBlazorやRustのyewなどWebassemblyを使う
Google マップの 15 年を振り返ってみましょう
メディア関係者向けお問い合わせ先 メールでのお問い合わせ: pr-jp@google.com メディア関係者以外からのお問い合わせにはお答えいたしかねます。 その他すべてのお問い合わせにつきましては、ヘルプセンターをご覧ください。
一休.comホテルページのスマホ版からjQuery依存を取り除くためにやったこと - 一休.com Developers Blog
一休.comでWebフロントエンドを開発している宇都宮です。 先日、一休.comホテルページのスマホ版から、jQueryを取り除きました。jQueryを取り除いた経緯、やったこと、結果について書きます。 ちなみに、ホテルページには以下のURLでアクセスできます（スマホで開くか、PCの場合はUAをスマホに偽装する必要があります） https://www.ikyu.com/sd/00001290/ なぜjQueryを取り除いたのか？ どうやったのか 何をやったのか jQuery.ajax() => fetch に置き換え fetchのpolyfillを採用した理由 DOM操作を標準APIに置き換え 要素の取得 show/hide addClass/removeClass html/text アニメーション $.ready() イベントフィルタリング jQueryの使用を防ぐ目印 jQuery削
まだ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とかしか使ったことがな
Removing jQuery from GitHub.com frontend
EngineeringRemoving jQuery from GitHub.com frontendWe have recently completed a milestone where we were able to drop jQuery as a dependency of the frontend code for GitHub.com. This marks the end of a gradual, years-long… We have recently completed a milestone where we were able to drop jQuery as a dependency of the frontend code for GitHub.com. This marks the end of a gradual, years-long transiti
型付き ⊄ 型なし - soutaroブログ
最近、TypeScriptについて考えることが多い。SideCIでWebフロントエンドの開発に使いはじめたこともあるし、Steepの開発をしていて「TypeScriptだとどうなるんだっけ？？」などと言いながら試してみることもある。 TypeScriptは型付きのJavaScriptである。構文はほとんど同じで、使えるライブラリもかなり近い。JavaScriptへの変換はかなり自明で、ランタイムは全く同じ。性能の差はない。Webpackやnpmを初めとするツール群もかなり共通しているし、アプリケーションも似たようなもん。書いている気分には、ほとんど差がない。つまり、TypeScriptとJavaScriptでプログラミングしているときに、なにか違いを感じるとすれば、それは（ほとんど）型付きの言語と型なしの言語の差と考えて良い。 RubyとJavaを比較するのとは、全然話が違う。構文も意味も
さよなら、Firebug | POSTD
最も人気が高くパワフルなWeb開発ツール。 Firebugはこれまでに驚異的な成功を収めており、その12年の歴史において、オープンソースのツールとして、Web開発者の間でカルト的な人気を築き上げてきました。登場したのは2005年、Firefoxブラウザでコードの検査、編集、デバッグをできるようにした最初のツールです。また、どのようなWebページにおいても、CSS、HTML、JavaScriptの調査を可能にしています。これは大きな前進でした。 Firebugは多くの人の注目を集め、現在でも100万人以上の熱心なファンがそれを使用しています。 そのような中、来月リリースされるFirefox Quantum (バージョン57) で、Firebugが終焉を迎えるのは残念でなりません。ただし、現在のFirefox Developer ToolsにFirebugの全ての機能が盛り込まれている点につい
Learn web development | web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
Google マップが 10 歳になりました。
メディア関係者向けお問い合わせ先 メールでのお問い合わせ: pr-jp@google.com メディア関係者以外からのお問い合わせにはお答えいたしかねます。 その他すべてのお問い合わせにつきましては、ヘルプセンターをご覧ください。
Ajax(pjax)遷移時におけるSNSボタン再構築
Updated 2013.10.04 / Published 2013.10.04 HTML5のhistoryAPI（pushState）とAjaxを組み合わせた遷移（pjax）時に、Twitterのwidgets.jsで埋め込んだツイートボタンが更新されない事態に遭遇しました。pushStateでURLは変更できているにも関わらず、ツイートボタンを押しても取得されるタイトルとURLは最初にツイートボタンを表示したときの遷移前の状態であり、ごっそり入れ替えてもDOMが再構築されていない様子。 TwitterのAPIドキュメントを探すも、Ajax遷移時にDOMを再構築させるような使い方はどこにも載っていない。そこで、検索語を「Tweet button Ajax」に変えてみると、Cannot update tweet button with AJaxという記事がヒット、回答欄に解決策を提示して
Isomorphic Survival Guide
isomorphic tokyo meetup http://nodejs.connpass.com/event/13363/
フロントエンドを楽にするために
フロントエンドを楽にするために Qiitaを支えたい技術 at 時雨祭 About HN: mizchi Qiitaの方からきました(入社半年たったらしい) Reactオジサンはそろそろ飽きてきた Angularに興味が無いのでこっちにきた 最近の業務 Kobito for Windows Closedβ中: もうちょい待ってろ お前らウェブエンジニアはWindows使わないのでβユーザー集めにくいんじゃ 省力モード 一昨日がClosedβリリースだったんで察してくれ！！！ ついさっきまでバグフィックス用のビルド作ってた Qiitaを支える技術? 4ヶ月ほどほぼソロ作業 正直カウボーイぎみ OSSでドキュメントガンガン書いてカバー(したい) 業務から派生したOSS mizchi/arda Flux フレームワーク mizchi/stone-skin IndexedDb ラッパー mizch
Ajax 誕生から 10 年とこれから - Block Rockin’ Codes
Intro 誕生と言うのが正しいか微妙だけど、多分誕生でいいと思います。 というのも、「Ajax」という名前の出典は以下の記事で、この記事が書かれたのが今日からちょうど 10 年前でした。 Ajax: A New Approach to Web Applications (当時から、 URL が一回変わっている) Web 初めてまだ 10 年たって無いんで、全部見てきたってわけではないですが、個人的にはちょっと思い出深い記事だったりするので、ちょっと振り返ってみます。 Ajax: A New Approach to Web Applications 筆者の Jesse James Garrett 氏は UX のコンサルティング会社である Adaptive Path の創立メンバーの一人で、 UX エンジニアです。 この記事の趣旨は、当時既にあった Google Maps や Gmail、G
FlaskをJSから叩いてエラーになった時に対話的デバッグする方法 - 西尾泰和のはてなダイアリー
WebアプリフレームワークのFlask(が内部で使っているWerkzeug)は、デバッグモードをONにしておくとエラーが起きた時にそのエラー画面からブラウザ上で対話的にコードを実行したり変数を表示させたりしてデバッグが出来る。これは超便利。なのだけど、最近JSからAPIを叩くケースが多くなって、その場合JSが予期しないHTMLを受け取ってパースに失敗するだけなので折角の対話的デバッグが生かせない。 そこで、エラー時には新しいwindowを開いて、レスポンスの内容をそちらに書き出すようにした。初回だけポップアップブロックが発動してしまうけど、それ以降はこれでAPIでも対話的デバッグが出来る。 $.ajax({ url:'/buggy/', data: 'q=42', success: function(x){console.log(x)}, error:function(x){ var w
ServiceWorker を使った XHR のモックテスト - Block Rockin’ Codes
Intro 似た話は既出なのでご提案にはならないけど、PoC として一応ライブラリっぽくしてみた。 タイトルの通り XHR のリクエストに対して、任意のレスポンスを返すことによって、 再現の面倒なエラー処理などのテストを、 Local Proxy 無しで実現する方法のメモ。 というか、これ自体がブラウザ上の JS だけで完結する Local Proxy と言えるかもしれません。 ざざっと書いただけなので、API というか使い方もまだ適当というかどうしようか考えてるところです。 今これが使えるブラウザ自体がそんなにないので、 SW の実装が普及するまでにもう少しまともにしておきます。 Jxck/response-injection · GitHub 色々踏んだので、 Service Worker 使う際の参考になればと。 モチベーション Service Worker(SW) には色々な機能が
jQueryとAngularJSにおけるAjaxの微妙な違い | ゆっくりと…
AngularJS の勉強、始めました。 最初はそのプログラミングに関する独特のお約束事項にイラッとしましたが、キモであろう DI を「疎な関係のクラスを（実行時に）結びつけるのに必要な仕組み」と割り切り、DI – 猿でも分かる! Dependency Injection: 依存性の注入 で引用されている ITpro 記事 の クラス図 をコードから想像できるようになったところで、それなりに面白くなってきました。 何より「jQuery が要らなくなる！」のがとっても快感なんです （つらい時もあるけど…）。 さて今回は、jQuery まみれのページを AngularJS で書き換えた時に気付いた Ajax の動作 − 非同期通信の戻り値をいつどこで DOM に反映するか − に関する話題を書いてみます。 jQueryの場合 検索のクエリを渡すと Github のリポジトリを返す関数を例にとっ
IE10 以下を切る場合の JavaScript チェックリスト - Qiita
この投稿は、 JavaScript Advent Calendar 18日目の記事です。 更新履歴 こちら をご覧下さい JavaScript の書き方をアップデートする JavaScript Good Parts で書かれているような JS の書き方は、古くなりつつある部分も多いです。 正直なところ、自分はあの本が「今でも」良書だとは思っていません。 初学者に勧めることもしません。まんべんなさと普遍性と客観性から「パーフェクト JavaScript」 を勧めています。 その頃と比べると、 JavaScript をとりまく環境は変わりました JavaScript の進化に合わせて書き方もアップデートしていくべきなので、今回は分かりやすいしきい値として 「IE10 以下を切れるとしたら」 という前提で、列挙してみます。 たとえば XHR2 や File API に依存したサービスをやる場合な
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Internet Explorer 11 はサポートを終了しました。長年のご愛顧ありがとうございました。 - Windows Blog for Japan
【翻訳】 2016年にJavaScriptを学んでどう感じたか - Endo Tech Blog
