ブックマーク / web.dev (3)

  • Service Worker のライフサイクル  |  Articles  |  web.dev

    Google uses AI technology to translate content into your preferred language. AI translations can contain errors. サービス ワーカーのライフサイクルは、最も複雑な部分です。何をしようとしているのか、どのようなメリットがあるのかわからないと、AI が自分と戦っているように感じられることがあります。仕組みを理解すれば、ウェブとネイティブのパターンの長所を組み合わせて、シームレスで邪魔にならないアップデートをユーザーに提供できます。 詳細な説明ですが、各セクションの冒頭にある箇条書きに、知っておくべきことがほとんど記載されています。 インテント このライフサイクルの目的は次のとおりです。 オフラインファーストを可能にする。 現在のサービス ワーカーを中断することなく、新しいサービス ワ

  • "Same-site" and "same-origin"  |  Articles  |  web.dev

    "Same-site" and "same-origin" are frequently cited but often misunderstood terms. For example, they're used in the context of page transitions, fetch() requests, cookies, opening popups, embedded resources, and iframes. This page explains what they are and how they're different from each other. Origin The structure of an origin. "Origin" is a combination of a scheme (also known as the protocol, fo

  • Shadow DOM v1: self-contained web components | Web Fundamentals - Google Developers

    Shadow DOM v1 - 自己完結型のウェブ コンポーネント コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 概要 Shadow DOM を使用すると、ウェブアプリの脆弱性を解消できます。脆弱性は、HTMLCSS、JS のグローバルな性質に起因しています。Google では長年にわたり、この問題を回避するための膨大な数のツールを開発してきました。たとえば、新しい HTML id またはクラスを使用する場合、ページで使用されている既存の名前と競合するかどうかはわかりません。微妙なバグが潜伏し、CSS 限定性が大きな問題になります(!important すべての要素が対象になります)。スタイル セレクタが制御不能になり、パフォーマンスが低下する可能性があります。他にもさまざまな機能があります。 Shadow DOM は CSS と DOM を修正します

    digo
    digo 2020/03/11
  • 1