TypeScriptの型情報を使って、サポート対象のブラウザが実装してないメソッドの利用をエラーにするESLintルール
TypeScriptの型情報を使って、サポート対象のブラウザが実装してないメソッドの利用をエラーにするESLintルール eslint-plugin-typescript-compatはTypeScriptプロジェクト向けのESLintルールです。 このESLintではサポートしているブラウザが、実装していないメソッドを検知してLintエラーにしてくれます。 JavaScriptではメソッドの静的解析は難しい(メソッド名が同じでも独自実装の可能性があるため)ですが、TypeScriptの型情報を使って静的解析をしています。 サポートしている機能 [ ] JavaScriptのビルトインオブジェクト [x] プロトタイプメソッド Array.prototype.find [x] 静的メソッド Array.from [ ] オブジェクト Promise [ ] DOM API 基本的にメソッド
対応ブラウザバージョンを考える | フューチャー技術ブログ
新しいウェブベースのシステムを開発する場合、あるいは更新する場合に問題になるのがブラウザのバージョンです。アプリケーションを実装する場合、場合によっては最新の機能を利用したいと思うかもしれませんが、場合によってはその機能を実装したブラウザのシェアが高くないかも？ ということが考えられます。どの機能が使えるのかを選択するには、まずはブラウザのバージョンを決めなければなりません。 セキュリティアップデートがされているブラウザのバージョン状況基本的にはセキュリティ更新がされているOSとそれがサポートしているブラウザのみを対象にするのが良いでしょう。また、最近はOSのバージョンとブラウザのバージョンは独立していてブラウザは自動更新となっているケースがほとんどです。 詳細は後で別項目にまとめますが（まとめたら分量が多くなって読みにくくなったので後ろに分割して移動した)、2023年2月現在このセキュリ
Browsh
Browsh is a fully-modern text-based browser. It renders anything that a modern browser can; HTML5, CSS3, JS, video and even WebGL. Its main purpose is to be run on a remote server and accessed via SSH/Mosh or the in-browser HTML service in order to significantly reduce bandwidth and thus both increase browsing speeds and decrease bandwidth costs. Download (v1.8.0) Browsh is available as a single s
Content-Disposition の filename という地雷。 (1個の観点で17個の脆弱性を見つけた話) - ぶるーたるごぶりん
English ver: https://gist.github.com/motoyasu-saburi/1b19ef18e96776fe90ba1b9f910fa714#file-lack_escape_content-disposition_filename-md TL;DR 1つのブラウザ、1つのプログラミング言語、15個の { Web Framework, HTTP Client ライブラリ, Email ライブラリ / Web Service 等} で脆弱性を見つけました。 見つけた脆弱性は、全て 1つの観点で発見した (多分 50-80 くらいのプロダクトの調査をした)。 RFC の記載では、（かなりわかりにくく）この問題に対する要件が記載されており、WHATWG > HTML Spec の方はしっかりと書かれているといった状況にある。 この問題は、 Content-Dispo
Vimでカーソル下の単語を簡単にWeb検索できるプラグインの紹介 | DevelopersIO
はじめに 先日、秋葉原で開かれたVim Conf 2019に参加しました。 どれも素晴らしいセッションが続きましたが、個人的に特に有り難かったのがUjihisa様のセッション「13 Vim plugins I use every day」でした。 その中で紹介されていたプラグインの一つ、open-browser.vimと、その便利な設定についてご紹介できればと思います。 open-browser.vimは、文字通り（カーソル下の）URLをブラウザで開く事ができる便利プラグインです。 加えて、設定次第で任意のWebページでのキーワード検索を簡単に行うことができます。（後述） 検証環境 以下、手元の検証環境です。 マシン / OS Mac / macOS Mojave Vim $ vim --version | head -n 1 VIM - Vi IMproved 8.1 （以下略） Plu
textlint editor を使ってブラウザで textlint を使う - アクトインディ開発者ブログ
morishitaです。 久しぶりに文章校正ツール textlint について書きます。 textlint については過去に２回取り上げました。 tech.actindi.net tech.actindi.net 過去のエントリはテキストエディタから利用する方法を紹介したものですが、今回は textlint のブラウザ拡張について紹介します。 以前からブラウザ上で文章を書くときにも textlint を使いたいなぁと思っていました。 結構前からtextlint: 文章チェッカーという Chrome 拡張があるのですが、自由にルールを設定できないようだったので見送っていました1。 今回紹介するものは textlint の作者自身が開発した拡張で、独自の設定で利用できるものです！ インストールから使えるところまで 早速使う準備をしていきましょう。 ブラウザ拡張のインストール Chrome と
ブラウザバック時の表示を最適化する Yahoo!ニュースの取り組み事例
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Yahoo!ニュース を担当しているエンジニアの喜楽です。 今回は、Yahoo!ニュースが取り組んでいるブラウザバック時の表示最適化手法について紹介します。 なぜブラウザバック時の挙動に注目するのか ユーザーがYahoo!ニュースのページを閲覧し、別のページに遷移する方法は大きく分けて以下の2つが考えられます。 （A） リンクをたどってページを遷移する （B） ブラウザーのナビゲーションボタンまたはスワイプ操作によって遷移する 「戻る」による遷移（ブラウザバック） 「進む」による遷移（ブラウザフォワード） Yahoo!ニュースでは総PVのうち一定程度が(B)のブラウザバックまたはブラウザフォワードによるページ遷移時のも
サイト公開前のブラウザチェックを簡単に行う方法。不具合発見後の対応も解説 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
うどん県出身・Webディレクターのセイタです。夏にジムへ入会しましたがバキバキな身体にはなりませんでした。来年の夏はビーチのスターになれるようにやっていきます。 さて今回は、制作したWebサイトの公開前に必ず実施する、ブラウザの表示テストについて学び直したことをまとめました。 制作が完了し、これでリリースできる！ と喜ぶのはまだ早い。このテストを完了させてこそ、はじめてきちんとした状態で公開を迎えられるのです。 なぜブラウザの表示テストを実施するのか？ 先に結論から言うと、さまざまな端末およびブラウザにおいて制作したWebサイトの品質を担保するためです。 もう少し柔らかく言い直すと、ユーザーは様々な環境でWebサイトを閲覧するため、どの環境においても問題なくWebサイトが表示されるようにテストする、ということです。 ユーザーが閲覧する環境は端末だと、下記がありますね。 Windows Ma
見ているサイト上に露出している機密情報(APIトークン、IPアドレスなど)を見つけるブラウザ拡張を作りました
見ているサイト上に露出している機密情報(APIトークン、IPアドレスなど)を見つけるブラウザ拡張を作りました SecretlintというAPIトークンなどの機密情報がファイル内に含まれているかをチェックできるツールを書いています。 Secretlintはコマンドラインツールとして動くので、主にCIやGitのpre-commit hookを利用して、リポジトリに機密情報が入るのを防止できます。 SecretlintでAPIトークンや秘密鍵などのコミットを防止する | Web Scratch 一方で、実際のウェブサービスなどは機密情報がファイルにハードコードされているわけではなく(Secrelint自体がこういうハードコードを防ぐツールです)、環境変数やDatabaseに保存していると思います。 このような場合にも、コードのミスなどによって公開するべきではない情報(秘密鍵、APIトークン、Sl
Dark Reader — dark theme for every website
How to enable Dark Mode on Facebook, Amazon, YouTube, Google Search, Wikipedia, Twitter and many other websites? Install Dark Reader browser extension. Configure the dark theme: brightness, contrast and sepia. Enable for all websites or particular domains. Use the following official links: Dark Reader for Chrome Dark Reader for Firefox Dark Reader for Safari Dark Reader for Edge Dark Reader is an
GhostText: 好きなブラウザでの入力を好きなエディタで行う
B! 18 0 0 0 最近はクラウドサービスとしてブラウザ内ですべて使えるサービスも増えてきましたが、 長い文章を書こうと思うと好きなエディタで書きたいな、と思うことがあります。 GhostText はそういった思いを好きなブラウザ+好きなエディタで実現してくれます。 GhostText インストール(Chrome + Neovim) 使い方 やっていること 似たような拡張機能(主にVim関連) GhostText GhostText はブラウザのテキストボックスへの入力を 外部エディタから入力できるようにしてくれるブラウザの拡張機能です。 すごいには、どのブラウザ、どのエディタ、という限定ではなく、 様々な組み合わせを実現しているところです。 ブラウザ: Google Chrome Firefox GhostText Microsoft Edge Opera エディタ: Sublime
Chrome Dev Tools: Markup and Style | Envato Tuts+
It is necessary for web developers to understand and know how to use browser developer tools, and in this tutorial, I will introduce you to the Chrome Developer Tools. You'll learn some of the basics, starting with marking up and styling a web page. A quick note to existing developer tool users: The purpose of this tutorial is to provide a relatively basic introduction to Chrome's developer tools.
ブラウザー上でJPEG圧縮して非可逆性を体感してみる : 404 Blog Not Found
2012年09月09日16:00 カテゴリアルゴリズム百選Lightweight Languages ブラウザー上でJPEG圧縮して非可逆性を体感してみる 詳解 画像処理プログラミング C言語で実装する画像処理アルゴリズムのすべて 昌達慶仁 「GIMPでJPEGの蚊を退治して"PNG"化する」「javascript - で bilateral filter (選択的ガウスぼかし)を実装してみた」の反響で、「JPEGのqualityを100に設定すればいいんじゃね?」という誤解がかなり見受けられたので。 実際に体験していただければいいかと。 Demo: File APIを実装しているブラウザーで動きます。ファイルを読み込ませたら、Qualityをいろいろいじってみてください。元画像、JPEG、両者の差の順で表示されます。差の画像をクリックすると差をエンハンスしてくれます。ブラウザー別に以下の
WebScoketを使った面白い試み。WebブラウザをWebサーバ化·browserver MOONGIFT
browserverはWebブラウザをWebサーバ化してしまうユニークなWebサービスです。 JavaScriptやnode.jsなどWebブラウザには様々な新しい技術が入り込んできています。その結果、これまでには見た事もなかったようなサービスも登場しています。今回は自分のWebブラウザがWebサーバ化してしまうbrowserverを紹介します。 普通にアクセスしても404が返ってきます。 Webブラウザ側です。別なブラウザからのアクセス結果が表示されています。 例えばターミナルから位置情報を取得するアクセスをします。 そうするとWebブラウザに位置情報アクセスの確認が表示され、OKするとターミナルに位置情報が返却されます。 こんな感じにPATCHアクセスをします。 そうするとWebブラウザ側のコンテンツが変化します。 browserverの仕組みは専用のキーを発行し、そのキーをURLに埋
iOS版Chrome リリースに見るiOSプラットフォームの制約 - naoyaのはてなダイアリー
iOS版の Chrome がリリースされましたね。 アプリとしての使い勝手どうこうというところよりも、JavaScript エンジン周りをどうしているのかに興味があったのだけど、TechCrunch の記事 (http://techcrunch.com/2012/06/28/hands-on-with-googles-chrome-for-ios-just-like-chrome-for-android-only-slower/) を見る限り v8エンジンは搭載されていないし、当然 UIWebView での JIT コンパイラも有効にはなっていないように見えました。つまり、JavaScript の実効速度に関して言えば、Mobile Safari のそれを上回ることはない。(厳密に言えば、純粋な JavaScrpit の実効速度以外のところの実装が良くてトータルとして速い、というようなこと
dmolsen.com
The reactions are always interesting when I tell people that Pattern Lab requires PHP. Invariably there's an "Ew" or audible groan followed-up by the seemingly incredulous question, "Why?!" The obvious practical consideration is that PHP is what I know best so it would seem to make sense that that's the reason why it's written in PHP. But I could have learned something new if I had wanted to. The
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Run Mac OS 8 in Your Browser
ブラウザ / Browser
ちいさな Web ブラウザを作ってみよう
GitHub - balta2ar/brotab: Control your browser's tabs from the command line