[GH-ISSUE #131] 一些性能优化建议 #114

New issue

Open

opened 2026-02-27 05:57:06 +03:00 by kerem · 0 comments

kerem commented

2026-02-27 05:57:06 +03:00

Owner

Originally created by @lyf534631748 on GitHub (Dec 26, 2025).
Original GitHub issue: https://github.com/hxh19950701/WebViewTvLive/issues/131

作者你好：

我看到自动全屏是基于video标签识别（部分网站可能是css属性名），只需要完整的DOM结构即可实现，具体样式不影响功能，也许可以过滤CSS加快渲染速度。再激进一些，甚至在注入脚本中限制js创建的元素类型，以下代码未经测试～


function proxyCreateElement() {
  const originalCreateElement = document.createElement
  // 允许创建的标签白名单
  const allowedTags = ['video', 'source', 'track', 'script', 'style']
  // 重写createElement方法
  document.createElement = (tagName) => {
    const tag = tagName.toLowerCase()

    if (allowedTags.includes(tag)) {
      return originalCreateElement.call(document, tagName)
    }

    return null
  }

  // 同样拦截innerHTML设置
  const originalInnerHTMLSetter = Object.getOwnPropertyDescriptor(
    Element.prototype,
    'innerHTML',
  ).set

  Object.defineProperty(Element.prototype, 'innerHTML', {
    set(value) {
      // 过滤HTML内容，只保留video相关标签
      const filteredHTML = value.replace(/<(?!\/?(video|source|track|script)\b)[^>]*>/gi, '')
      originalInnerHTMLSetter.call(this, filteredHTML)
    },
    get: Object.getOwnPropertyDescriptor(Element.prototype, 'innerHTML').get,
  })
}

考虑发起维护一个核心资源list，屏蔽一些网站的非核心脚本，例如cctv.com中，以下脚本资源都是非必须：
考虑在资源拦截层增加缓存代理，电视台网站性能优化做的比较烂，cctv.com中似乎没有开启缓存策略，每次刷新都会走网络加载资源

Originally created by @lyf534631748 on GitHub (Dec 26, 2025). Original GitHub issue: https://github.com/hxh19950701/WebViewTvLive/issues/131 作者你好： 1. 我看到自动全屏是基于video标签识别（部分网站可能是css属性名），只需要完整的DOM结构即可实现，具体样式不影响功能，也许可以过滤CSS加快渲染速度。再激进一些，甚至在注入脚本中限制js创建的元素类型，以下代码未经测试～ ``` function proxyCreateElement() { const originalCreateElement = document.createElement // 允许创建的标签白名单 const allowedTags = ['video', 'source', 'track', 'script', 'style'] // 重写createElement方法 document.createElement = (tagName) => { const tag = tagName.toLowerCase() if (allowedTags.includes(tag)) { return originalCreateElement.call(document, tagName) } return null } // 同样拦截innerHTML设置 const originalInnerHTMLSetter = Object.getOwnPropertyDescriptor( Element.prototype, 'innerHTML', ).set Object.defineProperty(Element.prototype, 'innerHTML', { set(value) { // 过滤HTML内容，只保留video相关标签 const filteredHTML = value.replace(/<(?!\/?(video|source|track|script)\b)[^>]*>/gi, '') originalInnerHTMLSetter.call(this, filteredHTML) }, get: Object.getOwnPropertyDescriptor(Element.prototype, 'innerHTML').get, }) } ``` 2. 考虑发起维护一个核心资源list，屏蔽一些网站的非核心脚本，例如[cctv.com](https://tv.cctv.com/live)中，以下脚本资源都是非必须：<img width="2872" height="1602" alt="Image" src="https://github.com/user-attachments/assets/6a08c118-a2cc-4827-b302-c6882b3fc0dd" /> 3. 考虑在资源拦截层增加缓存代理，电视台网站性能优化做的比较烂，[cctv.com](https://tv.cctv.com/live)中似乎没有开启缓存策略，每次刷新都会走网络加载资源