Webアプリケーションで 60fpsを(極力)目指すKMC 春合宿2017で発表したトークです。
JavaScript における文字コードと「文字数」の数え方 | blog.jxck.io
Intro textarea などに入力された文字数を、JS で数えたい場合がある。 ここで .length を数えるだけではダメな理由は、文字コードや JS の内部表現の話を理解する必要がある。 多言語や絵文字対応なども踏まえた上で、どう処理するべきなのか。 それ自体は枯れた話題ではあるが、近年 ECMAScript に追加された機能などを交えて解説する。 なお、文字コードの仕組みを詳解すること自体が目的では無いため、BOM, UCS-2, Endian, 歴史的経緯など、この手の話題につき物な話の一部は省くこととする。 1 文字とは何か Unicode は全ての文字に ID を振ることを目的としている。 例えば 😭 (loudly crying face) なら 0x1F62D だ。 1 つの文字に 1 つの ID が割り当てられているのだから、文字の数を数える場合は、この ID の
Polyfill のあり方と Web の進化と協調するためのガイドライン | blog.jxck.io
Intro W3C の TAG から、主にブラウザ API の Polyfill に関するドキュメントが公開された。 Polyfills and the evolution of the Web Polyfill は便利な一方で、時として標準化の妨げになってしまう場合があるため、それを避けるために、Polyfill 実装者、利用者、仕様策定者などが、どう振る舞うべきかという趣旨である。 今回はこの内容を元に、Web の進化と協調する Polyfill のあり方について、主に「実装者」がどうすべきかに着目し記す。 Web における Breaking Change Breaking Change は、簡単に言えば 後方互換を失うことで既存のものが壊れる可能性がある変更 のことを表す。 そして、Web における Breaking Change (Break the Web)、具体的には Web
Modern JavaScript Date Utility Library
date-fns provides the most comprehensive yet simple and consistent toolset for manipulating JavaScript dates in a browser & Node.js.
CSP Report 収集と実レポートの考察 | blog.jxck.io
Intro このブログで CSP レポートの収集を開始してもうすぐ 1 年になる。 現状、対象ドメイン内で <input> は一切提供しておらず、大半が静的に生成されたページであるが、この条件でも、かなり多くのレポートが集まった。 今回は、収集した実際のレポートを例に、攻撃ではないと思われるレポートとしてどういったものが送られて来たかを中心に、その内容やレポーティングサーバ、CSP の運用に関する現時点の考察についてまとめる。 収集目的 CSP の基本は、意図しないリソースの読み込みや、Inline Script の実行を防ぐことにある。 例えば、エスケープ漏れにより XSS が発生し、悪意のある Inline Script が埋め込まれた場合でも、Inline Script を禁止するポリシーを適用したページでは、その実行はブラウザによって Violation(違反)と判断されブロックさ
Front-End Performance Checklist 2021 (PDF, Apple Pages, MS Word) — Smashing Magazine
Let’s make 2021… fast! An annual front-end performance checklist (available as PDF, Apple Pages, MS Word), with everything you need to know to create fast experiences on the web today, from metrics to tooling and front-end techniques. Updated since 2016. Ah, you can also get useful front-end tips in our email newsletter. This guide has been kindly supported by our friends at LogRocket, a service t
Slack上でインタラクティブに遊べるゲームを作るためのフレームワークを作った - MANA-DOT
この記事は Slack Advent Calendar 2016 24日目の記事です。 半年ほど前に下のようなエントリを書きました。 Slack上でインタラクティブに倉庫番を遊べるhubot-slack-soukobanを作った - MANA-DOT Slackのリアクション機能と編集機能を活用し、Slack上でインタラクティブにゲームを作るという趣旨の内容でした。 今回は、このようなゲームを汎用的に作るための slack-game-bot というnpmパッケージを (アドベントカレンダーのネタのために)作ったので紹介します。 概要 兎にも角にも、例を見ていただくのが早いです。 const {Game, GameBot} = require('slack-game-bot'); class MyGame extends Game { getButtons() { return ['one'
カノジョできないので出会い系アプリのJS技術を調べてみた - Qiita
この記事はカノジョできないエンジニアアドベントカレンダー17日目の記事です。 みなさんこんにちは。相変わらずカノジョができないエンジニアのPotato4dです。 カノジョできないエンジニアのみなさんの中には、出会うために出会い系プラットフォームを利用してる人もたくさんいらっしゃるかと思います。 しかしながら、エンジニアといえば、やはり出会い系のプラットフォームで使われている技術は気になるもの。 自分の推しではない技術が使われていたプラットフォームで出会ってしまった日には、夜も眠れません。 ということで、今回は各出会い系プラットフォームで使われている技術を調べてみました。 なお、私は普段出会い系アプリのたぐいは、面白いプロフィールをみつけては知り合いに見せあって大笑いしているだけのタイプなので、サービス内容自体については詳しく知りません。 実際に検証する では実際に、技術を見ていきたいと思い
Mackerelにおけるフロントエンドのパフォーマンス改善の取り組み - Hatena Developer Blog
この記事は、はてなエンジニアアドベントカレンダー2016の14日目の記事です。13日は id:astj による『Perl 6 のモジュールエコシステムの話とモジュールを公開する話 (2016年12月版) - 平常運転』でした。 こんにちは。Mackerelチームでアプリケーションエンジニアをやっている id:itchyny です。 Mackerelは、同じ役割を持つホストを束ねた「ロール」、そしてロールを束ねた「サービス」というまとまりでホストを管理し、一覧性の良いグラフ画面を提供しています。 ロールあたりのホスト数、そしてサービスあたりのロール数が増えると、グラフの画面のパフォーマンスに大きく影響します。 Mackerelチームでは大規模なサービスでも快適にグラフを閲覧できるように、継続的に画面のパフォーマンスを改善してきました。 本記事では、Mackerelのフロントエンドのパフォーマ
HTTP Headers という 5万人が使っている Chrome 拡張のマルウェア疑惑。セッション盗まれて BTC も盗まれそうになった話。 - clock-up-blog
疑惑どころか 99.99% くらい黒な話。 （後記：セッション盗まれたと思ってたけど、よくよく考え直してみると生パスワードごと盗まれてる可能性もあるしやばい） 追記：続報 11月3日 今回指摘した HTTP Headers 以外にも、「Tab Manager」「Give Me CRX」「Live HTTP Headers」等で同様（？）の問題が報告されています。第三者が元の作者からソフトウェア権利を買い取って悪用する、というケースが割とある模様（？）。皆さま情報ありがとうございます。 11月4日 Zaif については、「不正な Chrome 拡張」と「スクリプトから保護されていなかったクッキー」のコンボによりセッションが盗まれていた可能性あり。 Zaif のセッション情報が盗まれた原因のひとつについて。JavaScript からクッキー値を取得させない方法。 - clock-up-blog
Node v7 で入った WHATWG URL 実装について | blog.jxck.io
Intro Node v7.0.0 が公開され、今回のリリースで WHATWG URL の実装が Experimental として入った。 既に標準で含まれていた url module との違いや、URL API などについて解説する。 WHATWG URL URL は非常によく使われる、Web において重要なフォーマットの一つだ。 ものによっては一見シンプルに見えるかもしれないが、その仕様はそれなりに大きい。 しかし、これまで DOM/JS はこれをパースする専用の API を持っていなかったため、例えば <input type=text> に入力された URL 文字列のパースは、片手間な正規表現で行われることも少なくなかった。 同様に、動的生成されるクエリやハッシュなどを URL に含める場面でも、やはり文字列操作による構築が行われてきた。 片手間な正規表現や文字列処理が、URL が本
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
既存のx86/ARM CPUほぼ全てに通用するJavaScript攻撃が発見される ～アドレス空間配置のランダム化を突破
JavaScript製FlashPlayer「swf2js」swfをそのままHTML5に変換。 - Qiita
GUN - Graph Database
GitHub - 01alchemist/TurboScript: Super charged typed JavaScript dialect for parallel programming which compiles to WebAssembly
xvg
GitHub - onivim/oni: Oni: Modern Modal Editing - powered by Neovim
GitHub - shift-js/shift-js: Swift to JavaScript transpiler
GitHub - daurnimator/lua.vm.js: The project is superceded by Fengari. See https://fengari.io/
Why you should avoid using document.write, specifically for scripts injection
