npm is joining GitHub
AI & MLLearn about artificial intelligence and machine learning across the GitHub ecosystem and the wider industry. Generative AILearn how to build with generative AI. GitHub CopilotChange how you work with GitHub Copilot. LLMsEverything developers need to know about LLMs. Machine learningMachine learning tips, tricks, and best practices. How AI code generation worksExplore the capabilities and be
ブラウザの「戻る」ボタンでキャッシュが表示されてしまう際の対策 - Qiita
はじめに 各ブラウザの「戻る」ボタンを押すと、ブラウザのキャッシュをクリアしていても、 JavaScriptでリンク遷移時にローディングアイコンをページ全体に表示 「戻る」ボタンを押す ローディングアイコンが全体に表示されたページが読み込まれる といったことが発生する場合があります。 これはキャッシュには下記の2種類あり、ブラウザバックの場合はbfcache用の対策が必要となるためです。 通常のキャッシュ（ページや画像など、ブラウザの”キャッシュを削除”で削除できるもの） bfcache(戻る/進むボタン用のキャッシュ) 確認環境 IE11 iOS7 戻るボタンで不具合が起こる理由 「戻る」ボタン用のキャッシュは、JavaScriptの処理が全て完了した状態をメモリ上に保持しています。 キャッシュとしてメモリ上の情報を読み込むことで表示を高速化しているのですが、 JavaScriptの処理
2018/11/27に判明したnpmパッケージ乗っ取りについて - Qiita
概要 event-streamというnpmパッケージに攻撃コードが混入されました。攻撃コードはflatmap-streamというパッケージに含まれており、event-stream パッケージはこの flatmap-stream への依存性を追加される形で間接的に攻撃コードの実行を行う状態になっていました。 攻撃コードが分析された結果、copayというBitcoinウォレットからクレデンシャルを盗むことを目的とされていたことが確認されています。 参考リンク 調査が行われているGitHub Issue HackerNewsスレッド Details about the event-stream incident - The npm Blog 影響をうけたパッケージ event-stream@3.3.6 flatmap-stream@0.1.1 flatmap-stream@0.1.1 パッケージ
一休.comレストランのスマートフォン検索ページがSPAになりました - 一休.com Developers Blog
一休.com レストランは今年の 7 月 18 日、スマートフォン向け検索ページのリニューアルを行いました。このエントリーでは、その中身について少し紹介させていただきます。 検索ページの課題 一休.com レストランではスマートフォン向け検索ページに対して「遅い」という課題意識がありました。これは技術面で少しブレイクダウンすると; パーソナライズドを含む複雑な処理を行っているため、サーバーサイド処理が重い。 UI 上無駄な遅延処理を行っているため、クライアントサイドの描画が遅い。 というサーバー側とクライアント側両方の課題がありました。クライアントサイドの「無駄な遅延処理」というのは; 検索結果取得が REST API 化されているにも関わず、再検索の度にページリロードを行い、サーバーサイドの描画からやり直している。 という実装に問題がありました。下図がリニューアル前のページ描画の様子です
オラクル、JavaやJavaScript、Ruby、Pythonなど多言語対応を単一ランタイムで実現する「GraalVM」をオープンソースで公開。Twitterが本番環境で採用
オラクル、JavaやJavaScript、Ruby、Pythonなど多言語対応を単一ランタイムで実現する「GraalVM」をオープンソースで公開。Twitterが本番環境で採用 JavaやJavaScriptなどには、それぞれその言語を実行するためのランタイムが存在します。JavaならJavaVM、JavaScriptならJavaScriptエンジンといった具合です。 米オラクルがオープンソースで公開した「GraalVM」は、これまで言語ごとに個別に用意されていたランタイムを統合し、単一の高性能なVMにするという同社の研究の結果開発された汎用仮想マシンあるいは汎用ランタイムです（米オラクルのブログ、日本語訳）。 GraalVMのWebサイトには、次のような説明が記されています。 GraalVM is a universal virtual machine for running appli
10 Tips for Javascript Debugging Like a PRO with Console
I must admit it for the first time, and I’ll use this platform to clean up the skeletons from my development closet. Sometimes, the magic I do — which some call “coding” — is not as perfect as the outcome might appear to my colleagues when the magnificent results are shown to them. Yes, I said it - sometimes, I use the old trial and error we all call debugging :) Don’t judge a SaaS platform by its
イマドキのJavaScriptの書き方2018
PySpa統合思念体です。これからJavaScriptを覚えるなら、「この書き方はもう覚えなくていい」（よりよい代替がある）というものを集めてみました。 ES6以降の難しさは、旧来の書き方にプラスが増えただけではなく、大量の「旧来の書き方は間違いを誘発しやすいから非推奨」というものを作り出した点にあります。5年前、10年前の本やウェブがあまり役に立たちません。なお、書き方が複数あるものは、好き嫌いは当然あると思いますが、あえて過激に1つに絞っているところもあります。なお、これはこれから新規に学ぶ人が、過去のドキュメントやコードを見た時に古い情報を選別するためのまとめです。残念ながら、今時の書き方のみで構成された書籍などが存在しないからです。 たぶん明示的に書いていても読み飛ばす人はいると思いますが、すでに書いている人向けではありません。これから書くコードをこのスタイルにしていくのは別にいい
await vs return vs return await
When writing async functions, there are differences between await vs return vs return await, and picking the right one is important. Let's start with this async function: async function waitAndMaybeReject() { // Wait one second await new Promise((r) => setTimeout(r, 1000)); // Toss a coin const isHeads = Boolean(Math.round(Math.random())); if (isHeads) return 'yay'; throw Error('Boo!'); } This ret
idやclassを使ってテストを書くのは、もはやアンチパターンである - Qiita
いきなり結論を書くと、idやclassはスタイルのためのものなので、テストでそれを使うのはやめましょう。そして、カスタムデータ属性を使いましょう。(idやclassはスタイルのためだけではないという意見はごもっともです！しかし、主にとしてスタイルに使われるということでご了承頂いて以下の駄文に付き合って頂けると幸いです🙇) 先に断っておくと主にreactについての話で、JSXを前提とします。(手法はReactに限りませんが理由は後述) 2020/03/23 追記 この記事は1年以上前に書かれた記事なのでテストフレームワークとしてenzymeを使っていますが、現時点ではTesting Libraryの使用をオススメします。data-testid に対応するクエリを備えています。 React Testing Library · Testing Library はじめに ご存知の通り、ロジックと
ES6 Promises: Patterns and Anti-Patterns
When I first got started with NodeJS a few years ago, I was mortified by what is now affectionately known as “callback hell”. Fortunately, here in 2017, NodeJS has adopted the latest and greatest JavaScript features, and since v4 has supported Promises. But while Promises make code more concise and readable, they can be a bit daunting to those who are only familiar with callbacks. Here I’ll lay ou
Passing data between Promise callbacks
In Promise-based code, there are usually many callbacks, each one having a separate scope for variables. What if you want to share data between those callbacks? This blog post describes techniques for doing so. The problem # The following code illustrates a common problem with Promise callbacks: The variable connection (line A) exists in one scope, but needs to be accessed in other scopes (line B
Fetch の中断と Promise のキャンセル方法の標準化 | blog.jxck.io
Intro XHR から fetch() に積極的に移行しづらかった最大のミッシングピースとして、中断できないという問題があった。 これは、fetch() が選んだ Promise ベースのインタフェースにおいて、キャンセルをどうするかという議論と絡み、長く決着が付かずにいた問題である。 最近、やっと話が前進したので、ここまでの経過を解説する。 Fetch のミッシングピース fetch() は、ブラウザが発行するリクエストと、取得するレスポンスを扱う低レベルなインタフェースとして策定が始まった。 DOM の API が Promise ベースに移行しつつある流れを汲み、fetch() もまた Promise を返す関数一発スタイルになった。 クラスからインスタンスを生成しメソッドを呼ぶ XHR スタイルでは、インスタンスを再利用した場合の挙動などを含め、オブジェクトのライフサイクルを考慮
Node.js で発生した Hash flooding DoS とその内容について - from scratch
Node.js のセキュリティアップデート 7/11 に Node.js のセキュリティアップデートがリリースされました。 Security updates for all active release lines, July 2017 | Node.js これには複数の脆弱性が報告されており、今回はそのうちの1つの Hash flooding DoS という脆弱性が何なのか、それに対して採用された対策が何なのかについてお話します。 Hash flooding DoS (hashdos) Denial Of Service 、つまりサービス拒否攻撃の一種です。 JavaScript のオブジェクトは内部的にハッシュテーブルとして表現されています。 図はこちらから引用 ハッシュ関数は同じkeyなら同じ値を返しますが、別なkeyなら通常は別な値になります。 ハッシュテーブルのinsert, g
QUnitの基本的な使い方 - but hopeful
[追記] 2013/9/1 三年前の記事が未だに読まれているようなので、一応書いておきますが、あれから色々変わってもっと良いものも出ています。 QUnit でも別に問題はないですが、今から QUnit を使うよりは http://visionmedia.github.io/mocha/:title=mocha] とかの方が個人的にはお勧めです。とにかく、今は色々あるのでもっと別の選択肢調べて見ることを個人的にはおすすめします。別に QUnit は使わないほうが良いとは言いません。 JavaScriptのテスティングフレームワークはいろいろありますが、自分は今主にQUnitを使っているので、少し使い方をまとめて見たいと思います。 [追記]今回作成したソースを上げました。ninja.js QUnit とは QUnitはもともと、jQueryをテストするために開発されたJavaScript Un
Number.EPSILON - JavaScript | MDN
標準組み込みオブジェクトNumberコンストラクターNumber() コンストラクター静的メソッドNumber.isFinite()Number.isInteger()Number.isNaN()Number.isSafeInteger()Number.parseFloat()Number.parseInt()静的プロパティNumber.EPSILONNumber.MAX_SAFE_INTEGERNumber.MAX_VALUENumber.MIN_SAFE_INTEGERNumber.MIN_VALUENumber.NaNNumber.NEGATIVE_INFINITYNumber.POSITIVE_INFINITYインスタンスメソッドNumber.prototype.toExponential()Number.prototype.toFixed()Number.prototype.to
console.logまとめ 2016年夏 - Qiita
console.log関連についてまとめました。 モダンブラウザであればどれも使用できると思いますが、基本出力結果等はchromeで確認したものです。 console.hogehogeのいろいろ console.log 基本 引数を入れることで出力結果をカスタマイズできます console.info、console.warn、console.error それぞれで見た目を変えることができます。 console.assert 式を評価してfalseの場合にログ出力します。 console.count ログの出力結果が同じ場合にカウント数が自動的に増えていきます。 console.dir オブジェクトのプロパティの中身をログに出力します。 console.dirxml HTMLとかXMLの要素を渡すと、下の要素が全部見れるようになります。 console.group、conosle.group
シンプルでかつ最高のJavaScriptプロファイラ sjsp を作りました！ ― Webアプリケーションが複雑化する中でプロファイラに求められるものとは何か - プログラムモグモグ
あらすじ Web技術が複雑になる中で、JavaScriptのプロファイリングをとる方法とは。 プロファイリングを取るためのコードを手で書いてみましょう。 とてもシンプルで、かつ最高のJavaScriptプロファイラ sjsp を作りました。 本当にあった怖い話 上司 「とにかくJavaScriptのコードを速くしてくれ」 私 「分かりました、速くします」 (次の日) 私 「いいプロファイラがないなら作ればいいじゃない」 同じチームの人 「えっ？」 私 「最高のJavaScriptプロファイラ作ったよ」 同じチームの人 「「えっえっ？？？」」 私 「早速使ってみたらこことここが遅いって分かったよ」 同じチームの人 「「「この子は一体…」」」 JavaScriptのプロファイリングの難しさ 近年、Webブラウザーの処理速度は著しく向上し、その可用性の高さから、アプリケーションのプラットフォーム
redux への 不満を解消する為に, flumptというFlux実装を作った - Qiita
名前はダークソウルのフラムト(frampt)から。FLux Minimum なんたらかんたら。 なんかTwitterで色々言ってたら naoyaさんにまとめられたので、ここに僕の考えを詳しく書いておく。 mizchi の Redux 考 - Togetterまとめ やりたかったこと 基本的なアイデアは、stateをpushする方式(setStateみたいな)だと非同期間で参照したときの値がズレて非同期の終わる順番次第では状態の遷移ステップが壊れてしまう可能性があるんだけど、前のstateをとって次のstateを返す非同期をキューに並べて順に実行することで、トランザクションみたいなものを保証することができるだろう、というもの。 軽量(pubsubインターフェースはEventEmitterそのまま) 複数の状態更新関数の待ち合わせ reduxで感じた不満の解消 TypeScriptフレンドリー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Accessing Nested Objects in JavaScript
フロントエンド実装中に使えるモックサーバを爆速で準備する - Qiita
