mirror of
https://github.com/hectorqin/reader.git
synced 2026-11-12 05:50:54 +08:00
CodeBuddy
d0a475919d
用户的三个问题在这里落地： 1. 「H5 是一个完整的客户端」——同一份构建产物既由服务端托管（`/` 直接 就是完整阅读器），也可被 Android 外壳打进 assets 复用，两种宿主只差 一个 serverUrl。 2. 「纯 H5 时 epub 等资源是否需要 iframe 或 shadow DOM」——用 shadow DOM， 但不是为了隔离出版方样式（那做不到也不该做：书必须能给自己排版）。 它挡的是反方向：客户端自身的 CSS 不会漏进书里。iframe 只在 PDF 那一处 用，因为 PDF 需要自己的浏览上下文，理由写在 render/container.ts 里。 3. 「Android 端 epub 用 H5 渲染，其他类型用原生」——按 kind 分流， capabilities() 明确声明：reflowable 走 WebView，paged/document 在 Android 交回原生。理由写进 reader-view.ts：WebView 每页一个合成层， 300MB 的画册在一台中端机上就是 OOM。 服务端同步配合的两处： - 资源流式下发 + HTTP Range - epub 按包内路径寻址、items/manifest 分窗 前端无框架：渲染热路径是命令式 DOM 操作，引框架只会把"最小覆盖 CSS" 的策略搞复杂；最终产物 35KB（gzip 10.7KB）。
24 lines
766 B
HTML
24 lines
766 B
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<!--
|
|
`viewport-fit=cover` plus the safe-area variables in the stylesheet are what
|
|
keep a page from running under a notch or a home indicator. Without them the
|
|
last line of every page is partially hidden on a modern phone, which looks
|
|
like a rendering bug rather than a layout one.
|
|
-->
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover"
|
|
/>
|
|
<meta name="color-scheme" content="light dark" />
|
|
<meta name="theme-color" content="#ffffff" />
|
|
<title>书库</title>
|
|
</head>
|
|
<body>
|
|
<div id="app"></div>
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html>
|