読者です 読者をやめる 読者になる 読者になる

Browser

Microsoft Edge(Project Spartan, Internet Explorer) 、ブラウザ周辺、Web フロントエンド開発、UI、など

Microsoft Edge まとめページ

Microsoft Edge のコンテキストメニュー (Windows 10 / 10 Mobile Anniversary Update)

ほぼ確定だと思われるので記事を書きました。

開発者向け設定で「コンテキスト メニューに "ソースの表示" と "要素の検査" を表示する」をオンにすると、ソースの表示と要素の検査が追加されます。

 

Windows 10

 

ページ全体

f:id:x67x6fx74x6f:20160721155032p:plain

  • すべて選択
  • 印刷

設定変更で「要素の検査」「ソースの表示」が追加されます。

 

テキスト選択

f:id:x67x6fx74x6f:20160721155047p:plain

  • Cortana に質問
  • すべて選択
  • コピー

設定変更で「要素の検査」「ソースの表示」が追加されます。

 

リンク選択

f:id:x67x6fx74x6f:20160720152100p:plain

  • 新しいタブで開く
  • 新しいウインドウで開く
  • 対象をファイルに保存
  • リンクのコピー
  • リーディングリストに追加
  • Cortana に質問
  • すべて選択
  • 貼り付け

設定変更で「要素の検査」「ソースの表示」が追加されます。

 

画像選択

画像にリンクが設定されている場合は、下記の画像のようにリンクの項目が共に表示されます。

f:id:x67x6fx74x6f:20160720152225p:plain

  • Cortana に質問
  • 名前を付けて画像を保存
  • 画像の共有
  • すべて選択
  • コピー
  • 貼り付け

設定変更で「要素の検査」「ソースの表示」が追加されます。

 

Audio タグ選択

f:id:x67x6fx74x6f:20160720152203p:plain

  • 再生
  • ミュート
  • 名前を付けてオーディオを保存
  • 再生速度
    • 0.5
    • 1.0
    • 1.5
    • 2.0

設定変更で「要素の検査」「ソースの表示」が追加されます。

 

Video タグ選択

再生速度は Audio タグと同じです。

f:id:x67x6fx74x6f:20160720152155p:plain

  • 再生
  • ミュート
  • 名前を付けてビデオを保存
  • 再生速度
    • 0.5
    • 1.0
    • 1.5
    • 2.0

設定変更で「要素の検査」「ソースの表示」が追加されます。

 

タブ

f:id:x67x6fx74x6f:20160720152136p:plain

  • 閉じたタブを再度開く
  • 他のタブを閉じる
  • 右側のタブを閉じる
  • すべて最新の情報に更新
  • 複製
  • 新しいウインドウに移動
  • ピン留めする

 

戻る・進むボタン

ページのリンクなどからページ遷移している場合表示されます。
現在のページには背景色が付き、最下部の履歴ででウインドウ右からハブの履歴が表示されます。

f:id:x67x6fx74x6f:20160721160205p:plain

 

アドレスバー

状況によって表示するものが変化します。

  

アドレスバーに文字が入力されていない

クリップボードに検索文字がある場合、またはクリップボードが空の場合

f:id:x67x6fx74x6f:20160721160640p:plain

  • 貼り付け
  • 元に戻す

 

クリップボードに URL などがあるの場合

f:id:x67x6fx74x6f:20160720152112p:plain

  • 貼り付け
  • 貼り付けて移動
  • 元に戻す

 

アドレスバーに文字がある場合

こちらはクリップボードの文字列の違いや空でも同じものが表示されます。

f:id:x67x6fx74x6f:20160721160139p:plain

  • 切り取り
  • コピー
  • 貼り付け
  • 貼り付けて移動
  • 元に戻す
  • すべて選択

 

 

Windows 10 Mobile

文字や画像などを長押しで表示させることができます。

ページ全体

f:id:x67x6fx74x6f:20160725143651p:plain

 

テキスト選択

f:id:x67x6fx74x6f:20160725143703p:plain

 

リンク選択

f:id:x67x6fx74x6f:20160725143716p:plain

 

画像選択

f:id:x67x6fx74x6f:20160725143730p:plain

 

 

browser.hatenablog.com

Microsoft Edge の開発者向け設定 (Windows 10 / 10 Mobile Anniversary Update)

ほぼ確定だと思われるので記事を書きました。

以前、デフォルトでオンになっていた設定の機能が標準機能となっている模様です。

 

開発者向けの設定を見る

Microsoft Edge のアドレスバーに about:flags を入力すると、
開発者向けの設定項目が表示されます。
Googole Chrome でいう chrome://flags/ と同じようなものです。

 

設定を適用する場合

ブラウザのウインドウをすべて閉じるか、
タブすべてとじたのち、
再び Microsoft Edge を起動してください。

 

内容

Windows 10

f:id:x67x6fx74x6f:20160720105910p:plain

 

Windows 10 Mobile

f:id:x67x6fx74x6f:20160720143536p:plain

 

開発者向け設定

コンテキスト メニューに "ソースの表示" と "要素の検査" を表示する

デフォルトではコンテキストメニューにこの2つが表示されなくなりました。

有効にして各項目をクリックするとF12開発者ツールが開きます。 「ソースの表示」で DOMExplorer、「要素の検査」でデバッガーが開きます。

 

Microsoft 互換性リストを使う

IE 11 と同じようなものです。
こちらのチェックをオンにしても ActiveX コントロール、ツール バー、BHO、VB スクリプトが動くようにはなりません。

デフォルトでオン

 

ローカルホスト ループバックを許可する(デバイスが危険にさらされる可能性があります)

localhost や IP を入力してローカルホストにアクセスするための項目です。

以前はレジストリから設定する必要がありました。

デフォルトでオン

 

Adobe Flash Player にローカルホスト ループバックを許可する (デバイスが危険にさらされる可能性があります)

Flash Player で使用する際、ソケット通信などを localhost で動作させたい場合で使用します。

 

拡張機能の開発者向け設定を有効にする(これによりデバイスが危険にさらされる可能性があります)

拡張機能はセキュリティ上、ストアでインストールしたり特定の条件でしかインストールや実行できません。
それでは開発できない為、条件を緩和します。

   

Web ページに無制限のメモリを使用する許可をする(デバイス全体のパフォーマンスに影響する可能性があります)

負荷が高い処理をする際使用するものだと思われます。
Web ページの処理でメモリーリークがある場合、限界までメモリを使用する可能性があるので注意が必要です。  

試験的な機能

コンポジッション
Windows.UI.Composition を使う

Windows Runtime の Windows.UI.Composition の機能を使用します。

デフォルトでオン

 

スクロールサムを単独で作成する

詳細不明。

デフォルトでオン

 

レンダリングされたサイズで画像をデコードする

画像をブラウザで描画する際、表示するサイズで画像をデコードするものだと思われます。

デフォルトでオン

 

スタイル
固定位置要素で完全なスタック コンテンツを使う

CSS などの position 絡みの修正機能

デフォルトでオン

 

制御文字を表示する

制御文字が表示できるようです。
自分の環境ではオンにしても表示されませんでした。
また、どの制御文字が表示できるかも不明です。

 

試験的な選択コントロールを有効にする

詳細不明。

デフォルトでオン

 

@-ms-viewport ルールを有効にする

CSS Device Adaptation の仕様で定義されている @viewport に基づいてつくられた IE / Edge での機能。
詳しくは以下のリンクを参照。

デバイスの適合 (Windows)

 

スクロール
スクロール プロパティを body ではなく documentElement に適応する

デフォルトで scrollTop などが body に適応されています。
オンにすると documentElement に適応されます。

 

レスポンシブ スクロールバーのスクロールを有効にする

詳細不明

デフォルトでオン

 

タッチ

タッチイベント
タッチイベントを有効にする
  • 常にオン
  • タッチスクリーンが検出された場合のみオン
  • 常にオフ(デフォルト

 

タッチに関するマウス イベント
タップ ジェスチャに応答して互換性のあるマウス イベントを発生させる
  • 常にオン
  • タッチが有効になっている場合のみオン(デフォルト
  • 常にオフ

 

MSPointer イベント インターフェースを有効にする

ペン、筆圧やタッチなど、全てのポインタを Pinter イベントの MS 独自実装 MSPointer イベントで取得できるようにします。
通常 Pinter イベント が有効になっているため、機能がオフになっています。

 

Pointer イベント インターフェースを無効にする

MSPointer イベントを試す時や、Pointer イベントを使えない状態を試すときなどに使います。

 

JavaScript

試験的な JavaScript 機能を有効にする

プレビューや一部開発中の機能を使用できるようにします。

 

バッテリー寿命を改善するために、非表示タブで1秒に1回実行するだけです。

ラベルの文言通りバッテリー寿命を改善させます。

デフォルトでオン

 

従来の setInterval 動作を使用します。

ラベルの文言通り。

 

要素のプロパティ

要素に関連付けられたラベルに hover と active の状態を伝達する

hover と active を伝達できますが、通常では動作するものではない為、使用する際は注意が必要です。

 

ユーザー補助

ハイコントラストで背景をレンダリングする

Windows の設定アプリにある簡単設定のハイコントラストで適応したものが反映されます。

デフォルトでオン

 

Media Source Extensions 

Opus オーディオ形式を有効にする

ラベルの文言通り。

デフォルトでオン

 

Enable VP9 video format
  • Always On
  • Automatic(デフォルト
  • Always Off

 

WebRTC

WebRTC 接続でローカル IP アドレスを隠す

WebRTC 関係のものを開発するため ローカル IP 隠します。

試験的な H.264/AVC サポートを有効にする

H.264/AVC を使用できるようにします。

 

Fetch API

Fetch JavaScript API を有効にする

Fetch API を使用できるようにします。

 

Web ペイメント

試験的な Web ペイメント API を有効にする

Microsoft Wallet を使用し Web 上で決済を行う機能を有効にします。

 

ネットワーク

TCP Fast Open を有効にする

ブラウザのネットワーク接続を高速化します。

 

全画面表示

標準の Fullscreen API を有効にする

CSS や API 名称、振る舞いで標準の Fullscreen API が使えるようになります。

 

 

browser.hatenablog.com

Microsoft Edge の変更ログ - Windows 10 / Windows 10 Mobile Insider Preview Build 14393

今回も Edge 自体の変更はありません。
書き忘れていましたが、サイトをスタートピンに止めした時 browserconfig.xml を設定していない場合は Edge のアイコンが設定されましたが、以前のように favicon が張られるようになりました。

 

いつもの参照元(予定地)

https://developer.microsoft.com/ja-jp/microsoft-edge/platform/changelog/desktop/14393developer.microsoft.com

   

Mobile 対象端末

http://windows.microsoft.com/en-us/windows/preview-supported-phoneswindows.microsoft.com

続きを読む

Microsoft Edge の変更ログ - Windows 10 / Windows 10 Mobile Insider Preview Build 14390

Edge 自体の変更はありません。

 

いつもの参照元

developer.microsoft.com

   

Mobile 対象端末

http://windows.microsoft.com/en-us/windows/preview-supported-phoneswindows.microsoft.com

続きを読む

Microsoft Edge でより良い動画視聴

今回は WINDOWS INSIDER PROGRAM の Blog から参照

blogs.windows.com

いつも通りざっくり訳。 訳が間違っていたらごめんなさい。

 

Windows 10 の現状のバージョンでは、Microsoft PlayReady のコンテンツ保護Protected Media Path で安全性を確保し、ハードウェア処理などの機能強化で最も電力効率に優れたビデオ再生を行います。

Microsoft Edge ではこれらの機能を使用し最高のビデオ視聴体験を実現します。

 

効率なバッテリー消費のビデオ再生

以前、Edge Dev Blog で紹介した (このサイトでは訳し忘れています) ブラウザ別のバッテリー消費テストと同じものを使い動画のテストを行っています。

その結果、同じコンテンツのストリーミング動画再生した際、Google Chrome より3時間も多く再生でき、 状況によっては他のブラウザより 17 ~ 70% バッテリの持ちが良くなっています。

f:id:x67x6fx74x6f:20160714150532j:plain

www.youtube.com

Videotest by MicrosoftEdge

 

ビデオ再生中は低電力状態に CPU を保つよう Windows 10 プラットフォームの機能が働くように設計されています。

Microsoft Edge は最も電力効率に優れたビデオ再生を行い、PC や Mobile などでみられるビデオ処理操作で効率的なハードウェアしたり、Microsoft DirectX ビデオアクセラレーション(DXVA)を使用することでビデオの処理と表示や合成に必要なメモリ帯域幅を大幅に減少させます。

Windows 10 のメディアスタックに対し CPU 管理は、UI の応答性を損なうことがなく、可能な低電力状態での実行を保持し、 映画などのコンテンツは全画面再生中に低いリフレッシュ レートで表示して実行します。

そのことによって、メモリ帯域幅を減らし、電力を節約し、テレシネシャダーなどを行い映画再生の品質を向上させます。

また、オーディオストリーム処理専用に電力効率の優れたハードウェアオーディオを処理を行いメイン CPU の使用を低減させる Windows 10 オーディオスタックの機能も活用しています。

 

高品質のビデオ

上記では、最も電力効率の良いブラウザが Edge となりました。
プレミアム動画サイト(記事では NETFLIX)でも、他のブラウザに比べて高解像度と高ビットレートの映像を使用できます。

Maximum Resolution Maximum Bitrate
Microsoft Edge (EdgeHTML 13.10586) 1080p 7500
Opera 38 720p 4420
Mozilla Firefox 46 720p 4420
Google Chrome 51 720p 4420

 

以前に書いたのでセキュリティ等々は割愛。

 

今後は?

映像は Full HD である 1080 p を超える UltraHD / 4K 表示に移り始めています。 画素数だけではなく広色域や高フレームレート、ハイダイナミックレンジ(HDR)等の技術革新もあり、 オーディオも進化しており、マルチチャンネルによる空間、3次元音響もあります。

また、Microsoft も参画している Alliance for Open Media によって次世代メディア フォーマット、コーデックの開発をしています。

新しい高品質コンテンツのハードウェアアクセラレーションのサポートをグラフィックチップセット企業と取り組んでいます。

 

セキュリティの方も強化しており、Microsoft は改良されたハードウェアベースの DRM を「セキュリティ レベル 3000」と呼んでおり、 チップセットによるハードウェアベースの DRM は新しい PC で対応され、 フルサポートは2016年秋のソフトウエアコンポーネントの対応で完了します。

 

Windows 10 プラットフォームは、
バッテリとセキュリティ、多くのメディアをアプリで再生できる利点があります。

 

Windows 10 のメディア機能を使用する Microsoft Edge の動画視聴は、低消費のバッテリと品質の高いビデオ再生を提供し PC、Mobile、Xbox、HoloLens などの Windows プラットフォームで使用できます。

Microsoft Edge の変更ログ - Windows 10 / Windows 10 Mobile Insider Preview Build 14388

前回のバグが修正されました。

 

いつもの参照元(予定地)

https://developer.microsoft.com/ja-jp/microsoft-edge/platform/changelog/desktop/14388developer.microsoft.com

   

Mobile 対象端末

http://windows.microsoft.com/en-us/windows/preview-supported-phoneswindows.microsoft.com

続きを読む
スポンサーリンク