Algorithm VisualizerAlgorithm Visualizer is an interactive online platform that visualizes algorithms from code.
JavaScript Registryの今後 - from scratch
さて、前回は tink と yarn v2 における CLI 戦略の話でした。次は JavaScript Registry についてです。 ちなみにこの内容が今回 JSConf.EU 2019 で一番盛り上がったトピックです。 JavaScript Registry とは JavaScript Package をバックエンドで管理しているサービスです。 npm が管理しているものがいちばん有名です。他にも GitHub が管理する Registry が公開される予定です。 The economics of Package Management the economics of package management slide: github.com video: www.youtube.com 「Package Managementの経済」というタイトルです。 聴講者からすると、何話すのか
SharedArrayBufferとAtomics APIを用いてWorker間でデータを共有する
従来のJavaScriptではWorker間でのデータ共有はできませんでしたが、SharedArrayBufferとAtomics APIを用いればそれが実現できるようになりました。 WorkerはJavaScirptでマルチスレッドを実現するための仕組みです。詳しくは「Web Workersを用いてJavaScriptをマルチスレッド化する」をご覧ください。 Workerは元来メッセージのやりとりのみでデータを共有し、同じメモリの値を共有することはできませんでした。しかし近年になって導入されたSharedArrayBufferで、Worker間のメモリ共有が可能になりました。 SharedArrayBufferは固定長のTypedArrayです。使用するには、単にバイト長を指定してnewするだけです。 // SharedArrayBufferを作成する。 // SharedArrayBu
npmfs - home
JavaScript Package Inspector Package Viewer — Browse package files at any version. Package Diff — Compare packages across versions. Deep Links — Link to specific lines in files and diffs. Download Contents — Download any directory or file. Motivations Published packages don't always include a link to their source on GitHub. The linked repository is not necessarily representative of published packa
全モダンブラウザで使えるJavaScriptのdynamic import（動的読み込み） - Qiita
JavaScriptでは他のJSファイルを読み込みES Modulesという仕組みがあり、Chrome、Edge、Safariなどブラウザのサポートが拡大しつつあります（参考記事「JavaScriptでモジュールを使う時代に！ ブラウザで覚えるES Modules入門」）。 さらに、モジュールをimport()を使って「関数のように」呼び出すためのdynamic importという仕組みが2020年に公開されるECMAScriptの仕様で導入されます（tc39/proposal-dynamic-import）。Google Chrome、Firefox、Safariではではモジュールのdynamic importに対応しており、ブラウザでその挙動を確認できます。 dynamic importのメリットは、任意のタイミングでモジュールを読み込めること。たとえば、ページの初期表示に必要なJav
高速化の観点から new Array(100) を使わない方が良い理由
別件で V8 の JIT コードの逆アセンブルを眺めている時に気づいたのですが、JavaScriptで new Array(100) という形で配列を作るのは、高速化の観点から言うと V8 においては避けるべき書き方です。 高速化を求める方は、 new Array() や [] で作成して Array#push で追加していくのが良いでしょう。この記事では、その理由を説明します。 今回の記事は、以下の V8 のブログ記事を参考にしております。 https://v8.dev/blog/elements-kinds 「詰まった配列(Packed Array)」と「穴あき配列(Holey Array)」 v8 は内部的に、その配列がどういうタイプの配列であるかの状態を記録しており、その情報を利用して最適化を適用します。状態は内部的には21個あるのですが、今回話題にするのは、その中でも「詰まってい
SPAにおける状態管理:関数型のアプローチも取り入れるフロントエンド系アーキテクチャの変遷｜ハイクラス転職・求人情報サイト アンビ（AMBI）
こんにちは、小林（@koba04）です。 本記事では、シングルページアプリケーション（以下、SPA）における状態管理について解説します。 GmailやTwitterは、SPAとして構築されている代表的なWebアプリケーションであり、スムーズなページ遷移をSPAによって実現しています。またElectronやPWA（Progressive Web Apps）の登場により、複雑なアプリケーションをWebの技術を使って構築する場面も増えてきました。 これらの複雑なアプリケーションにおいては、既存のページ単位での状態管理の考え方では対応が難しくなります。 そこで今回は、具体的なフレームワークも取り上げながら、Webフロントエンドにおける状態管理のアプローチについて紹介します。 フロントエンドでの状態管理の複雑化 ページの単位を超えた状態の保持 モデルとビューによる処理の分割 イベントの管理が複雑にな
自作JSの読み込みはbodyの最後に書いたほうがいいのに、なんで外部ライブラリはheadにあるんでしょうか？ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 調べるキッカケ 最近フロントエンドを触り出して、JQueryの勉強（初歩中の初歩）をしていたのですが、 「JSの読み込みはbodyの最後に」という決め事があるようで、ちょっと気持ち悪いので調べていました。 すこしググると見解として、 HTML中にJavaScriptファイルを読み込む記述があると、そのJavaScriptを読み終わるまで、ウェブページのレンダリング(描画)が止まってしまうからです。 https://allabout.co.jp/gm/gc/380498/2/ などと記載されていて、なるほどと思ったのですが、 Qiitaの
GitHub - google/j2cl: Java to JavaScript transpiler
Seamless Java in JavaScript applications that tightly optimizes with Closure Compiler J2CL is a powerful, simple and lightweight transpiler from Java to Closure style JavaScript. Get the best out of Java and JavaScript. You no longer need to choose between the two or lock into a specific framework or a language. Choose the right language at the right place and hire the best talent for the job. Get
ブラウザがJavaScriptを直接サポートしない世界 - Qiita
TL;DR WASMって凄いね．JavaScript処理系すら実装できるんだって． ならブラウザはWASMだけをサポートすれば楽なんじゃないかな． という考察記事です． 経緯 私は少し前からRustでJavaScript処理系を書いています．(まだまだ機能不足ですが) ある日，ふと思いました．*Rustで書いてるんだからWASMに変換するのも楽なんじゃないか?*と． 面白そうなので，試してみたわけです． 意外と面倒だった RustからWASMへと変換する方法を説明した記事は，調べればいくらでもでてきます．無論そのとおりに手を動かしてみるわけです． しかし，いざやってみるとコンパイラに結構文句を言われます．考えてみれば当たり前ですが，libcなんて使っていたらWASMには変換できません． なので余分なコードは削り，WASMに変換できるようコードを書き直しました． すると，すんなりWASMに変
騙されるな。JavaScript の function は関数じゃない。コンストラクタだ。 - Qiita
といった書き方を目にしたことがあると思います。また、普段から「関数」として使っている人も多いと思います。 しかし、結論から言うと、JavaScript の function は普通の「関数」ではなく「コンストラクタ」です。JavaScriptの構文・キーワードに騙されてはいけません。(私自身、少し勘違いをしていて、以前書いた記事(JavaScript初心者にはfunctionよりも、まずアロー関数を教えるべき)では function は「メソッド」だと主張していました。) 「newができるからコンストラクタって言いたいだけなんでしょう」と思った方、とりあえずブラウザバックしようとする手を止めて最後までお読みください。 function を「関数」として使用すると、状況によってはパフォーマンスに影響する可能性があります(若干誇張表現です。最適化の度合いによります)。 以下、function
OYOのキャンペーン「#いきなり東京0円ライフ」をハッキングして当選してみた - Qiita
※プログラムの解析に類する内容を扱っております。 ※ハッキングと称していますが、犯罪に類する行為は一切しておりません。 ※混乱を避けるため当該キャンペーンの終了を待って、この記事を公開させていただきました。 プロモーション周りの分析も書いているのでこちらもぜひご一読ください https://note.mu/aiharayuki/n/n87909fdd40c7 まず実際に抽選してみましょう この「くじを引く」ボタンを押すことで抽選がされるわけだ。 ハズレの画面はこんな感じ 外れた。悲しい。 どういった仕組みでくじ引きが動いているんだろう phpかなんかでサーバーサイドで制御してるのかなー。 https://www.oyolife.co.jp/tokyo-cp/ どうやらjsで抽選をしているみたいだぞ？ でもまず基本のscript.jsをみてみよう クッキー消して何回かくじ引きしよう http
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【あるある】こんなコードは嫌だ【JavaScript】 - Qiita
GitHub - phimage/Erik: Erik is an headless browser based on WebKit. An headless browser allow to run functional tests, to access and manipulate webpages using javascript.
JavaScriptでの賢いconsole.log( )の使い方 & その他便利なconsole.xxx( )使い方まとめ (dir・table・warn・groupとか) - Qiita
https://www.tweag.io/posts/2019-05-09-inline-js.html/
【2019年4月版】JavaScriptのconsoleがすごいことになってた。 - Qiita
サーバーサイドエンジニアも知っておくべきフロントエンドの今
GitHub - goolord/jshark: 🦈 Safe JavaScript EDSL
Vuetify — A Vue Component Framework — Vuetify
