タグ

javascriptに関するblack-aquaのブックマーク (12)

  • Cloudflare Workers 入門【はじめからそうやって教えてくれればいいのに!】

    はじめに この記事の内容は、以下の動画でも解説しています。アニメーションでわかりやすくなっているので、ぜひ見てみてください。他にも Web に関する解説動画を投稿しているので、気になる人はチャンネル登録よろしくお願いします! Cloudflare Workers とは? Cloudflare Workers とは、一言で言うと、Cloudflare のエッジで動くサーバーレスの JavaScript 実行環境のことです。 ...と言っても、これだけだとよくわからないですよね。だから、今回は初めて触る人でもわかるように、順序だててわかりやすく解説していきます。 Cloudflare Workers 理解するための道のり Cloudflare Workers を理解するためには以下の3つのキーワードを理解することが重要です。 CDN エッジコンピューティング JavaScript 実行環境 こ

    Cloudflare Workers 入門【はじめからそうやって教えてくれればいいのに!】
  • JavaScriptをもうちょっと理解する54のトピック - Qiita

    この記事について JavaScriptはお好きですか? Reactなどフロンドエンドを中心に人気の言語なので、触ってる人はたくさんいると思います。 奥深くて自分も好きな言語ですが、結構なんとなくで触っていたりしませんか? 今回は自分が後輩によく聞かれた事や、自分が引っかかった事をたくさん書いていきます。 つまり基的には初心者向け、よくても中級者向けです。 何か一個でも知らない事があれば御の字のつもりで書いたので、ぜひ気軽に読んでください! JavaScript編 略称はJS、Javaダメぜったい いなさそうなのに稀にいるという・・ Web開発から入ってプログラムを広く知らない場合に発生しやすい? Javaは全く別に王者がいるので、万が一使っていたららやめましょう。 略称は JS(じぇーえす) でお願いします。 データ型、Object Objectはキーと値をいくつも持てるJSのデータ型で

    JavaScriptをもうちょっと理解する54のトピック - Qiita
  • jsエンジンはソースコードをどう実行しているのか〜バイトコード、JITコンパイル〜

    js実行環境であるnodeはV8を使っている jsエンジンはソースコードをどうやって実行しているのか ここからが題です。jsエンジンの裏側をのぞいてみましょう👀 全体像 下記が基的な流れ V8って書いてあるけど、下記の基的な流れはエンジンによらずほとんど同じはず もちろんそれぞれのフェーズで実装の違いは在る。“Optimize & Compile it”の具体的な実装などはエンジンにより異なる Benedikt Meurer; “An Introduction to Speculative Optimization in V8”; jsの面白いところは、ASTから直接コンパイルして実行されるわけでもなく、単純なインタプリタのようにコンパイルを挟まずに実行しているわけでもないところ。それに、なんだか見慣れない”Get feedback”というフェーズさえある……!ここがJIT com

    jsエンジンはソースコードをどう実行しているのか〜バイトコード、JITコンパイル〜
  • 2021年に知っておきたいJavaScript最適化技術34選 - Qiita

    最新の省略テクニック、コツ、秘訣で、JavaScriptコードを最適化する。 開発者の生活というのは常に新しいことを学ぶことで、その変化についていくことは決して難しいことではありません。私は、フロントエンド開発者として知っておく必要のある省略形や機能など、JavaScriptのすべてのベストプラクティスを紹介して、2021年の生活をより快適にしたいと考えています。 JavaScript開発に長く携わっている人でも、コードを追加しなくても問題解決できるような最新機能を知らないこともあるかもしれません。ここで紹介するものは、クリーンで最適化されたJavaScriptのコード記述にも、2021年のJavaScriptの面接準備にも役立ちます。 これは新しいシリーズで、2021年版のJavaScriptコーディングチートシートです。 1. 複数の条件を持つif 配列に複数の値を格納し、includ

    2021年に知っておきたいJavaScript最適化技術34選 - Qiita
  • Meta の新しいリッチテキストエディターフレームワーク Lexical を調べる

    Brand-new Rich Text Editor Framework! 先日 Meta から新しいリッチテキストエディターのフレームワーク Lexical の OSS 化が発表されました。 一方で、 Meta が開発していた既存の React 用リッチテキストエディターフレームワーク Draft.js はアーカイブが決定されました。 実は自分は業務で Draft.js をめちゃくちゃ使っていて、発展に期待しつつウォッチしていたので開発が終了してしまうのが非常に残念ではあるのですが、代わりにより高度に抽象化されたフレームワークが公開されたのでこれはマスターするしかありません。 ということで調べたことをまとめていこうと思います。 執筆時点(2022 年 4 月)では正式リリースされていないので、稿のサンプルコードは参考にならなくなる可能性があります。 概要 エディターを作るためのフレーム

    Meta の新しいリッチテキストエディターフレームワーク Lexical を調べる
  • GitHub - hikerpig/pintora: An extensible text-to-diagrams library that works in both browser and node.js

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

    GitHub - hikerpig/pintora: An extensible text-to-diagrams library that works in both browser and node.js
  • 爆速でわかるjQuery.Deferred超入門

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)です。これまで、JavaScriptで非同期処理を書く上での問題として、コールバック地獄やエラー処理に例外が使えないことなどを解説してきました。 これらの問題に対処するライブラリの1つであるjQuery.Deferredに関して、もう少し丁寧に解説いたします。なお、jQueryのバージョンは記事執筆時点の最新である、1.9.1を想定しています。 jQuery.Deferredとは jQuery.DeferredとはjQueryのバージョン1.5から導入された、非同期処理をうまく扱うための標準モジュールです。使いこなすことで、以下のような効果が見込めます。 非同期処理を連結

    爆速でわかるjQuery.Deferred超入門
  • JavaScript 今ドキな書き方 ES2020

    配信動画はこちら https://www.youtube.com/watch?v=x1XdqWtPUdg もし良かったらムーザルちゃんねるのチャンネル登録お願いします! https://www.youtube.com/channel/UCLPHXwLp90A5R69Eltxo-sg Tw…

    JavaScript 今ドキな書き方 ES2020
  • 新JavaScript例文辞典

    このページはJavaScriptの例文/サンプルを掲載しています。なお、対象としているのは基的にWeb標準ブラウザ (Firefox, Safari, Google Chrome, Operaなど) としているため標準仕様から外れているInternet Explorer 6~8では動作しないものがあります。Internet Explorer 8より前のバージョンに関しては以前のJavaScript例文辞典を参照してください。このサイトではInternet Explorer 8以降には、ある程度対応しています。IE9からはCanvasなどHTML5関連APIにも対応しています。 iPhone/iPadおよびAndroid 4もHTML5に対応しています。ただし、Android 2.xに搭載されている標準ブラウザでは対応していないAPIが多いため、ほとんど動作しません。 カテゴリ内のページの

  • JavaScriptテクニックブック

    このページはHTML, CSS, JavaScriptのファイルを分離したサンプルを掲載しています(JavaScriptテクニックブックとして書籍としても購入 (アマゾン) できます)。また、prototype.js、Yahoo UI Library、Script.aculo.us、Adobe Spryなどのライブラリも使用しています。これらのライブラリに関しては、各ライブラリのページから必要なファイルをダウンロードしてください。 ミスや間違い、リンクエラーなどがありましたらopenspc@alpha.ocn.ne.jpまでお願いします。 4月7日 SpryのアコーディオンとパネルのIE6での表示不具合を修正しました。HTML 4 TransitionalではSpryは正常に動作しないためです。 9月29日 書籍の113番(264~265頁)でHTMLのコードが別のファイルのものになってい

  • JavaScriptでDOMに挑戦:初心者のためのJavaScript入門(7) - @IT

    DOMの弱点とその対策 慣れてしまえば便利なDOMですが、「ブラウザによってドキュメントツリーの構造が違う」という弱点もあります。 例えば先ほどのサンプルはInternet Explorer 8用のDOMなので、Firefox(3.6.12)やGoogle Chrome(7.0.517.44)ではエラーが起きて、正しく動きません。 IE以外では、サンプルの10行目を次のように書き換える必要があります。 どうしてこのようなことが起きてしまうのでしょうか? このサンプルでもそうですが、ほとんどの人はJavaScriptHTMLのソースを書くときには、読みやすくなるようにスペースやタブを使って段落を付けたり、改行を使うと思います。 ところが、IE以外のDOMでは、HTML内で使っている「スペース、タブ、改行」が、いちいちすべてテキストノード扱いになってしまうのです。つまり、改行のたびに、空白の

    JavaScriptでDOMに挑戦:初心者のためのJavaScript入門(7) - @IT
  • XML -DOMとjavascriptで検索機能を作成する-

    ■ XML文書内を検索 javascriptとDOMを利用して、XML文書内を検索・表示する機能を作成します。 HTMLの入力欄(inputタグ)に入力されたキーワードに合致するデータを検索して、 画面に表示します。以下は具体的な機能・処理の流れです。 HTML文書内の入力欄にキーワードを入力し、検索を実行 ▼ ▼ javascriptによってXML文書が読み込まれ、DOMツリーを生成 ▼ ▼ 入力されたキーワードに合致するデータを検索 ▼ ▼ キーワードに合致するデータを新しいDOMツリーに追加 ▼ ▼ XSLTスタイルシートを読み込み、ツリーに適用 ▼ ▼ 結果を表示 これらの機能を実現する為に、これから何回かにわたって一つ一つの機能を 説明・追加作成していきます。今回は 入力欄の検索キーをクリックすると、DOMツリーを参照して表示してみます。 では、例題を取り上げてみましょう。 以下

  • 1