diff --git a/navigator-html-injectables/package.json b/navigator-html-injectables/package.json
index b6332de2..c09ca27d 100644
--- a/navigator-html-injectables/package.json
+++ b/navigator-html-injectables/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@readium/navigator-html-injectables",
-  "version": "2.4.2",
+  "version": "2.3.1-alpha.2",
   "type": "module",
   "description": "An embeddable solution for connecting frames of HTML publications with a Readium Navigator",
   "author": "readium",
diff --git a/navigator-html-injectables/src/helpers/css.ts b/navigator-html-injectables/src/helpers/css.ts
index c609bd4e..cbd2cdce 100644
--- a/navigator-html-injectables/src/helpers/css.ts
+++ b/navigator-html-injectables/src/helpers/css.ts
@@ -1,5 +1,7 @@
 import { ReadiumWindow } from "./dom.ts";
 
+export const isTypedOMSupported = () => typeof window.CSSTransformValue !== 'undefined';
+
 export function getProperties(wnd: ReadiumWindow) {
     const cssProperties: { [key: string]: string } = {};
 
diff --git a/navigator-html-injectables/src/modules/snapper/ColumnSnapper.ts b/navigator-html-injectables/src/modules/snapper/ColumnSnapper.ts
index 62a10fe0..f392a95e 100644
--- a/navigator-html-injectables/src/modules/snapper/ColumnSnapper.ts
+++ b/navigator-html-injectables/src/modules/snapper/ColumnSnapper.ts
@@ -8,6 +8,7 @@ import { rangeFromLocator } from "../../helpers/locator.ts";
 import { ReadiumWindow, deselect, findFirstVisibleLocator } from "../../helpers/dom.ts";
 import { PatternAnalyzer } from "../../protection/PatternAnalyzer.ts";
 import { BaseSuspiciousActivityEvent } from "../Peripherals.ts";
+import { isTypedOMSupported } from "../../helpers/css.ts";
 
 const COLUMN_SNAPPER_STYLE_ID = "readium-column-snapper-style";
 
@@ -166,7 +167,13 @@ export class ColumnSnapper extends Snapper {
                 const spos = position(currentScrollLeft, so, elapsed, period);
                 doc.scrollLeft = spos;
                 if(this.overscroll !== 0)
-                    doc.style.transform = `translate3d(${-lpos}px, 0px, 0px)`;
+                    if(isTypedOMSupported()) {
+                        doc.attributeStyleMap.set("transform", new CSSTransformValue([
+                            new CSSTranslate(CSS.px(-lpos), CSS.px(0), CSS.px(0))
+                        ]));
+                    } else {
+                        doc.style.transform = `translate3d(${-lpos}px, 0px, 0px)`;
+                    }
 
                 if (elapsed < period)
                     this.wnd.requestAnimationFrame(step);
@@ -282,10 +289,22 @@ export class ColumnSnapper extends Snapper {
 
         if(newpos < minScrollLeft) {
             this.overscroll = newpos;
-            this.doc().style.transform = `translate3d(${-this.overscroll}px, 0px, 0px)`;
+            if(isTypedOMSupported()) {
+                this.doc().attributeStyleMap.set("transform", new CSSTransformValue([
+                    new CSSTranslate(CSS.px(-newpos), CSS.px(0), CSS.px(0))
+                ]));
+            } else {
+                this.doc().style.transform = `translate3d(${-newpos}px, 0px, 0px)`;
+            }
         } else if(newpos > maxScrollLeft) {
             this.overscroll = newpos;
-            this.doc().style.transform = `translate3d(${-newpos}px, 0px, 0px)`;
+            if(isTypedOMSupported()) {
+                this.doc().attributeStyleMap.set("transform", new CSSTransformValue([
+                    new CSSTranslate(CSS.px(-newpos), CSS.px(0), CSS.px(0))
+                ]));
+            } else {
+                this.doc().style.transform = `translate3d(${-newpos}px, 0px, 0px)`;
+            }
         } else {
             this.overscroll = 0;
             this.doc().style.removeProperty("transform");
diff --git a/navigator/package.json b/navigator/package.json
index e6fc399b..9fb8a5e0 100644
--- a/navigator/package.json
+++ b/navigator/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@readium/navigator",
-  "version": "2.5.4",
+  "version": "2.4.0-alpha.17",
   "type": "module",
   "description": "Next generation SDK for publications in Web Apps",
   "author": "readium",
diff --git a/navigator/src/epub/EpubNavigator.ts b/navigator/src/epub/EpubNavigator.ts
index 97c92768..3423e059 100644
--- a/navigator/src/epub/EpubNavigator.ts
+++ b/navigator/src/epub/EpubNavigator.ts
@@ -238,11 +238,12 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
             });
         }
 
-        if(this._layout === Layout.fixed) {
+        if(this._layout === Layout.fixed || this._layout === Layout.scrolled) {
             this.framePool = new FXLFramePoolManager(
                 this.container,
                 this.positions,
                 this.pub,
+                this._layout,
                 this._injector,
                 this._contentProtection,
                 this._keyboardPeripherals
@@ -265,9 +266,15 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
 
         if(this.currentLocation === undefined)
             this.currentLocation = this.positions[0];
+        else
+            this.currentLocation = this.completeLocator(this.currentLocation);
 
         await this.resizeHandler();
-        await this.apply();
+        return new Promise(async res => {
+            await this.go(this.currentLocation, false, (s) => {
+                res(s);
+            });
+        });
     }
 
     public get settings(): Readonly<EpubSettings> {
@@ -885,7 +892,7 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
             return;
         }
 
-        const progression = locator?.locations?.progression;
+        const progression = locator.locations?.progression;
         const hasProgression = progression && progression > 0;
         if(hasProgression)
             done = await new Promise<boolean>((res, _) => {
@@ -896,7 +903,42 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
         cb(done);
     }
 
+    private completeLocator(locator: Locator): Locator {
+        if(!locator.href) {
+            let fellback = false;
+            if(typeof locator.locations.position === "number") {
+                const match = this.positions.find(p => p.locations.position === locator.locations.position);
+                if (match) {
+                    locator = match.copyWithLocations(locator.locations);
+                    fellback = true;
+                }
+            }
+            if(!fellback && typeof locator.locations?.totalProgression === "number") {
+                // If locator has no href, but it does have a totalProgression,
+                // we can attempt to find the right resource from the positions list.
+                // This is here to help with conversion from OPDS locators which only
+                // require the total progression in the publication.
+                const targetProgression = locator.locations.totalProgression;
+                let closestIdx = 0;
+                let closestDist = Infinity;
+                for (let i = 0; i < this.positions.length; i++) {
+                    const pos = this.positions[i];
+                    // Use totalProgression if available, otherwise estimate from index
+                    const posProg = pos.locations.totalProgression ?? (i / this.positions.length);
+                    const dist = Math.abs(posProg - targetProgression);
+                    if (dist < closestDist) {
+                        closestDist = dist;
+                        closestIdx = i;
+                    }
+                }
+                locator = this.positions[closestIdx].copyWithLocations(locator.locations);
+            }
+        }
+        return locator;
+    }
+
     public go(locator: Locator, _: boolean, cb: (ok: boolean) => void): void {
+        locator = this.completeLocator(locator);
         const href = locator.href.split("#")[0];
         let link = this.pub.readingOrder.findWithHref(href);
         if(!link) {
diff --git a/navigator/src/epub/frame/FrameBlobBuilder.ts b/navigator/src/epub/frame/FrameBlobBuilder.ts
index e05b49cd..704ada34 100644
--- a/navigator/src/epub/frame/FrameBlobBuilder.ts
+++ b/navigator/src/epub/frame/FrameBlobBuilder.ts
@@ -1,4 +1,4 @@
-import { Link, MediaType, Publication, ReadingProgression } from "@readium/shared";
+import { Link, MediaType, Publication, ReadingProgression, Resource } from "@readium/shared";
 import { Injector } from "../../injection/Injector.ts";
 import { getScriptMode } from "../../helpers/scriptMode.ts";
 
@@ -20,73 +20,121 @@ const csp = (domains: string[]) => {
     ].join("; ");
 };
 
-export default class FrameBlobBuider {
-    private readonly item: Link;
-    private readonly burl: string;
-    private readonly pub: Publication;
+export default class FrameBlobBuilder {
     private readonly cssProperties?: { [key: string]: string };
     private readonly injector: Injector | null = null;
 
+    private currentUrl?: string;
+    private currentResource?: Resource;
+
     constructor(
-        pub: Publication,
-        baseURL: string,
-        item: Link,
+        private readonly pub: Publication,
+        private readonly baseURL: string,
+        private readonly item: Link,
         options: {
             cssProperties?: { [key: string]: string };
             injector?: Injector | null;
         }
     ) {
-        this.pub = pub;
         this.item = item;
-        this.burl = item.toURL(baseURL) || "";
         this.cssProperties = options.cssProperties;
         this.injector = options.injector ?? null;
     }
 
+    public reset() {
+        this.currentUrl && URL.revokeObjectURL(this.currentUrl);
+        this.currentUrl = undefined;
+        this.currentResource?.close();
+        this.currentResource = undefined;
+    }
+
     public async build(fxl = false): Promise<string> {
-        if(!this.item.mediaType.isHTML) {
-            if(this.item.mediaType.isBitmap || this.item.mediaType.equals(MediaType.SVG)) {
-                return this.buildImageFrame();
+        if(this.currentUrl) return this.currentUrl;
+
+        this.currentResource = this.pub.get(this.item);
+        const link = await this.currentResource.link();
+        if(!this.currentResource) {
+            // Reset has occured in the meantime
+            return "about:blank";
+        }
+        if(!link.mediaType.isHTML) {
+            if(link.mediaType.isBitmap || link.mediaType.equals(MediaType.SVG)) {
+                const blobUrl = await this.buildImageFrame();
+                this.currentUrl = blobUrl;
+                return blobUrl;
             } else
-                throw Error("Unsupported frame mediatype " + this.item.mediaType.string);
+                throw Error("Unsupported frame mediatype " + link.mediaType.string);
         } else {
-            return await this.buildHtmlFrame(fxl);
+            const blobUrl = await this.buildHtmlFrame(fxl);
+            this.currentUrl = blobUrl;
+            return blobUrl;
         }
     }
 
     private async buildHtmlFrame(fxl = false): Promise<string> {
-        // Load the HTML resource
-        const txt = await this.pub.get(this.item).readAsString();
-        if(!txt) throw new Error(`Failed reading item ${this.item.href}`);
+        if(!this.currentResource) throw new Error("No resource loaded");
 
-        const doc = new DOMParser().parseFromString(
-            txt,
-            this.item.mediaType.string as DOMParserSupportedType
-        );
+        // Load the HTML resource
+        const link = await this.currentResource.link();
+        const doc = await this.currentResource.readAsXML() as HTMLDocument;
+        if(!doc) throw new Error(`Failed reading item ${link.href}`);
 
         const perror = doc.querySelector("parsererror");
         if (perror) {
             const details = perror.querySelector("div");
-            throw new Error(`Failed parsing item ${this.item.href}: ${details?.textContent || perror.textContent}`);
+            throw new Error(`Failed parsing item ${link.href}: ${details?.textContent || perror.textContent}`);
         }
 
         // Apply resource injections if injection service is provided
         if (this.injector) {
-            await this.injector.injectForDocument(doc, this.item);
+            await this.injector.injectForDocument(doc, link);
         }
 
-        return this.finalizeDOM(doc, this.pub.baseURL, this.burl, this.item.mediaType, fxl, this.cssProperties);
+        return this.finalizeDOM(doc, this.pub.baseURL, link.toURL(this.baseURL) || "", link.mediaType, fxl, this.cssProperties);
     }
 
-    private buildImageFrame(): string {
-        // Rudimentary image display
-        const doc = document.implementation.createHTMLDocument(this.item.title || this.item.href);
+    private async buildImageFrame(): Promise<string> {
+        if(!this.currentResource) throw new Error("No resource loaded");
+        const link = await this.currentResource.link();
+        const burl = link.toURL(this.baseURL) || ""
+
+        // Rudimentary image display in an HTML doc
+        const doc = document.implementation.createHTMLDocument(link.title || link.href);
+
+        // Add viewport if available
+        if((link?.height || 0) > 0 && (link?.width || 0) > 0) {
+            const viewportMeta = doc.createElement("meta");
+            viewportMeta.name = "viewport";
+            viewportMeta.content = `width=${link.width}, height=${link.height}`;
+            viewportMeta.dataset.readium = "true";
+            doc.head.appendChild(viewportMeta);
+        }
+
         const simg = document.createElement("img");
-        simg.src = this.burl || "";
-        simg.alt = this.item.title || "";
-        simg.decoding = "async";
+        simg.src = burl || "";
+        simg.alt = link.title || "";
+        await simg.decode(); // Reduce repaints
         doc.body.appendChild(simg);
-        return this.finalizeDOM(doc, this.pub.baseURL, this.burl, this.item.mediaType, true);
+
+        // Apply resource injections if injection service is provided
+        if (this.injector) {
+            await this.injector.injectForDocument(doc, new Link({
+                // Temporary solution to address injector only expecting (X)HTML
+                // documents for injection, which we are technically providing
+                href: "readium-image-frame.xhtml",
+                type: MediaType.XHTML.string
+            }));
+        }
+
+        // Add image style
+        const sstyle = doc.createElement("style");
+        sstyle.dataset.readium = "true";
+        sstyle.textContent = `
+        html, body { width: 100%; height: 100%; margin: 0; padding: 0; font-size: 0; }
+        img { margin: 0; padding: 0; border: 0; }`;
+        doc.head.appendChild(sstyle);
+
+        return this.finalizeDOM(doc, this.pub.baseURL, burl, link.mediaType, true);
     }
 
     private setProperties(cssProperties: { [key: string]: string }, doc: Document) {
@@ -102,6 +150,10 @@ export default class FrameBlobBuider {
         // Get allowed domains from injector if it exists
         const allowedDomains = this.injector?.getAllowedDomains?.() || [];
 
+        // Remove query from root if present, as CSP doesn't allow them
+        root = root?.split("?")[0];
+
+
         // Always include the root domain if provided
         const domains = [...new Set([
             ...(root ? [root] : []),
@@ -124,6 +176,7 @@ export default class FrameBlobBuider {
         // loaded in parallel, greatly increasing overall speed.
         doc.body.querySelectorAll("img").forEach((img) => {
             img.setAttribute("fetchpriority", "high");
+            img.setAttribute("referrerpolicy", "origin");
         });
 
         // We need to ensure that lang is set on the root element
diff --git a/navigator/src/epub/frame/FrameManager.ts b/navigator/src/epub/frame/FrameManager.ts
index 34856344..bceb4dd9 100644
--- a/navigator/src/epub/frame/FrameManager.ts
+++ b/navigator/src/epub/frame/FrameManager.ts
@@ -27,7 +27,7 @@ export class FrameManager {
         this.frame.sandbox.value = "allow-same-origin allow-scripts";
         this.frame.classList.add("readium-navigator-iframe");
         this.frame.style.visibility = "hidden";
-        this.frame.style.setProperty("aria-hidden", "true");
+        this.frame.ariaHidden = "true";
         this.frame.style.opacity = "0";
         this.frame.style.position = "absolute";
         this.frame.style.pointerEvents = "none";
@@ -111,7 +111,7 @@ export class FrameManager {
     async hide(): Promise<void> {
         if(this.destroyed) return;
         this.frame.style.visibility = "hidden";
-        this.frame.style.setProperty("aria-hidden", "true");
+        this.frame.ariaHidden = "true";
         this.frame.style.opacity = "0";
         this.frame.style.pointerEvents = "none";
         this.hidden = true;
@@ -140,9 +140,9 @@ export class FrameManager {
 
                     const remove = () => {
                         this.frame.style.removeProperty("visibility");
-                        this.frame.style.removeProperty("aria-hidden");
                         this.frame.style.removeProperty("opacity");
                         this.frame.style.removeProperty("pointer-events");
+                        this.frame.ariaHidden = null;
                         this.hidden = false;
 
                         if (sML.UA.WebKit) {
diff --git a/navigator/src/epub/frame/FramePoolManager.ts b/navigator/src/epub/frame/FramePoolManager.ts
index 6b869f3c..7ca428a1 100644
--- a/navigator/src/epub/frame/FramePoolManager.ts
+++ b/navigator/src/epub/frame/FramePoolManager.ts
@@ -1,12 +1,12 @@
 import { ModuleName } from "@readium/navigator-html-injectables";
 import { Locator, Publication } from "@readium/shared";
-import FrameBlobBuider from "./FrameBlobBuilder.ts";
+import FrameBlobBuilder from "./FrameBlobBuilder.ts";
 import { FrameManager } from "./FrameManager.ts";
 import { Injector } from "../../injection/Injector.ts";
 import { IContentProtectionConfig, IKeyboardPeripheralsConfig } from "../../Navigator.ts";
 
-const UPPER_BOUNDARY = 5;
-const LOWER_BOUNDARY = 3;
+const UPPER_BOUNDARY = 10;
+const LOWER_BOUNDARY = 5;
 
 export class FramePoolManager {
     private readonly container: HTMLElement;
@@ -14,8 +14,8 @@ export class FramePoolManager {
     private _currentFrame: FrameManager | undefined;
     private currentCssProperties: { [key: string]: string } | undefined;
     private readonly pool: Map<string, FrameManager> = new Map();
-    private readonly blobs: Map<string, string> = new Map();
-    private readonly inprogress: Map<string, Promise<void>> = new Map();
+    private readonly blobs: Map<string, FrameBlobBuilder> = new Map();
+    private readonly inprogress: Map<string, Promise<unknown>> = new Map();
     private pendingUpdates: Map<string, { inPool: boolean }> = new Map();
     private currentBaseURL: string | undefined;
     private readonly injector: Injector | null = null;
@@ -42,7 +42,7 @@ export class FramePoolManager {
         // Wait for all in-progress loads to complete
         let iit = this.inprogress.values();
         let inp = iit.next();
-        const inprogressPromises: Promise<void>[] = [];
+        const inprogressPromises: Promise<unknown>[] = [];
         while(inp.value) {
             inprogressPromises.push(inp.value);
             inp = iit.next();
@@ -62,10 +62,8 @@ export class FramePoolManager {
         this.pool.clear();
 
         // Revoke all blobs
-        this.blobs.forEach(v => {
-            this.injector?.releaseBlobUrl?.(v);
-            URL.revokeObjectURL(v);
-        });
+        this.blobs.forEach(v => v.reset());
+        this.blobs.clear();
 
         // Clean up injector if it exists
         this.injector?.dispose();
@@ -106,15 +104,18 @@ export class FramePoolManager {
                 this.pool.delete(href);
                 if(this.pendingUpdates.has(href))
                     this.pendingUpdates.set(href, { inPool: false });
+                // Note that we don't reset the blob here, unlike in the FXL pool.
+                // This is because FXL tends to have a ton more blobs. Maybe we'll adjust
+                // this at a later point with a much larger boundary for resets to deal
+                // with extremely long/large reflowable publications.
+                // Reflowable publication resources also tend to be much larger documents,
+                // so they're more expensive to preprocess with the FrameBlobBuilder.
             });
 
             // Check if base URL of publication has changed
             if(this.currentBaseURL !== undefined && pub.baseURL !== this.currentBaseURL) {
                 // Revoke all blobs
-                this.blobs.forEach(v => {
-                    this.injector?.releaseBlobUrl?.(v);
-                    URL.revokeObjectURL(v);
-                });
+                this.blobs.forEach(v => v.reset());
                 this.blobs.clear();
             }
             this.currentBaseURL = pub.baseURL;
@@ -127,18 +128,14 @@ export class FramePoolManager {
                     // when navigating backwards, where paginated will go the
                     // start of the resource instead of the end due to the
                     // corrupted width ColumnSnapper (injectables) gets on init
-                    this.blobs.forEach(v => {
-                        this.injector?.releaseBlobUrl?.(v);
-                        URL.revokeObjectURL(v);
-                    });
+                    this.blobs.forEach(v => v.reset());
                     this.blobs.clear();
                     this.pendingUpdates.clear();
                 }
                 if(this.pendingUpdates.has(href) && this.pendingUpdates.get(href)?.inPool === false) {
-                    const url = this.blobs.get(href);
-                    if(url) {
-                        this.injector?.releaseBlobUrl?.(url);
-                        URL.revokeObjectURL(url);
+                    const v = this.blobs.get(href);
+                    if(v) {
+                        v.reset();
                         this.blobs.delete(href);
                         this.pendingUpdates.delete(href);
                     }
@@ -157,7 +154,7 @@ export class FramePoolManager {
                 const itm = pub.readingOrder.findWithHref(href);
                 if(!itm) return; // TODO throw?
                 if(!this.blobs.has(href)) {
-                    const blobBuilder = new FrameBlobBuider(
+                    this.blobs.set(href, new FrameBlobBuilder(
                         pub,
                         this.currentBaseURL || "",
                         itm,
@@ -165,24 +162,33 @@ export class FramePoolManager {
                             cssProperties: this.currentCssProperties,
                             injector: this.injector
                         }
-                    );
-                    const blobURL = await blobBuilder.build();
-                    this.blobs.set(href, blobURL);
+                    ));
                 }
 
                 // Create <iframe>
-                const fm = new FrameManager(this.blobs.get(href)!, this.contentProtectionConfig, this.keyboardPeripheralsConfig);
+                const fm = new FrameManager(await this.blobs.get(href)!.build(), this.contentProtectionConfig, this.keyboardPeripheralsConfig);
                 if(href !== newHref) await fm.hide(); // Avoid unecessary hide
                 this.container.appendChild(fm.iframe);
                 await fm.load(modules);
                 this.pool.set(href, fm);
+                return fm;
             }
+
+            // Target frame is awaited
             try {
-                await Promise.all(creation.map(href => creator(href)));
+                await Promise.all(creation.filter(href => href === newHref).map(href => creator(href)));
             } catch (error) {
                 reject(error);
             }
 
+            // Remaining frames can resolve later
+            Promise.all(creation.map(async href => {
+                const c = creator(href);
+                this.inprogress.set(href, c);
+                await c;
+                this.inprogress.delete(href);
+            }));
+
             // Update current frame
             const newFrame = this.pool.get(newHref)!;
             if(newFrame?.source !== this._currentFrame?.source || force) {
diff --git a/navigator/src/epub/fxl/FXLFrameManager.ts b/navigator/src/epub/fxl/FXLFrameManager.ts
index e0cd57f5..f4218165 100644
--- a/navigator/src/epub/fxl/FXLFrameManager.ts
+++ b/navigator/src/epub/fxl/FXLFrameManager.ts
@@ -1,13 +1,14 @@
 import { Loader, ModuleName } from "@readium/navigator-html-injectables";
 import { Page, ReadingProgression } from "@readium/shared";
 import { FrameComms } from "../frame/FrameComms.ts";
-import { FXLPeripherals } from "./FXLPeripherals.ts";
+import { FXLPeripherals, isTypedOMSupported } from "./FXLPeripherals.ts";
 import type { ReadiumWindow } from "../../../../navigator-html-injectables/types/src/helpers/dom";
 import { IContentProtectionConfig, IKeyboardPeripheralsConfig } from "../../Navigator.ts";
 import { KeyboardConditionBridge } from "../../peripherals/KeyboardConditionBridge.ts";
 
 export class FXLFrameManager {
     private frame: HTMLIFrameElement;
+    private frameIsAppended = false;
     private loader: Loader | undefined;
     public source: string;
     private comms: FrameComms | undefined;
@@ -22,6 +23,7 @@ export class FXLFrameManager {
     public debugHref: string;
     private loadPromise: Promise<Window> | undefined;
     private showPromise: Promise<void> | undefined;
+    private viewportSize: { width: number, height: number } | undefined = undefined;
 
     constructor(
         peripherals: FXLPeripherals,
@@ -41,7 +43,7 @@ export class FXLFrameManager {
         this.frame.classList.add("blank");
         this.frame.scrolling = "no";
         this.frame.style.visibility = "hidden";
-        this.frame.style.setProperty("aria-hidden", "true");
+        this.frame.ariaHidden = "true";
         this.frame.style.display = "none";
         this.frame.style.position = "absolute";
         this.frame.style.pointerEvents = "none";
@@ -52,15 +54,17 @@ export class FXLFrameManager {
         this.frame.dataset.originalHref = debugHref;
         this.source = "about:blank";
 
-        // NEW
         this.wrapper = document.createElement("div");
         this.wrapper.style.position = "relative";
+        this.wrapper.style.contain = "strict";
         this.wrapper.style.float = this.wrapper.style.cssFloat = direction === ReadingProgression.rtl ? "right" : "left";
-
-        this.wrapper.appendChild(this.frame);
     }
 
     async load(modules: ModuleName[], source: string): Promise<Window> {
+        if(!this.frameIsAppended) {
+            this.wrapper.appendChild(this.frame);
+            this.frameIsAppended = true;
+        }
         if(this.source === source && this.loadPromise/* && this.loaded*/) {
             if([...this.currModules].sort().join("|") === [...modules].sort().join("|")) {
                 return this.loadPromise;
@@ -106,6 +110,7 @@ export class FXLFrameManager {
 
     // Parses the page size from the viewport meta tag of the loaded resource.
     loadPageSize(): { width: number, height: number } {
+        if(this.viewportSize) return this.viewportSize;
         const wnd = this.frame.contentWindow!;
 
         // Try to get the page size from the viewport meta tag
@@ -122,8 +127,10 @@ export class FXLFrameManager {
                 else if(match[1] === "height")
                     height = Number.parseFloat(match[2]);
             }
-            if(width > 0 && height > 0)
-                return { width, height };
+            if(width > 0 && height > 0) {
+                this.viewportSize = { width, height };
+                return this.viewportSize;
+            }
         }
 
         // Otherwise get it from the size of the loaded content
@@ -136,25 +143,47 @@ export class FXLFrameManager {
     update(page?: Page) {
         if(!this.loaded) return;
         const dimensions = this.loadPageSize();
-        this.frame.style.height = `${dimensions.height}px`;
-        this.frame.style.width = `${dimensions.width}px`;
         const ratio = Math.min(this.wrapper.clientWidth / dimensions.width, this.wrapper.clientHeight / dimensions.height);
-        this.frame.style.transform = `scale(${ratio})`;
+        if(isTypedOMSupported()) {
+            this.frame.attributeStyleMap.set("width", CSS.px(dimensions.width));
+            this.frame.attributeStyleMap.set("height", CSS.px(dimensions.height));
+            this.frame.attributeStyleMap.set("transform", new CSSTransformValue([
+                new CSSScale(ratio, ratio),
+            ]));
+        } else {
+            this.frame.style.height = `${dimensions.height}px`;
+            this.frame.style.width = `${dimensions.width}px`;
+            this.frame.style.transform = `scale(${ratio})`;
+        }
         const bcr = this.frame.getBoundingClientRect();
         const hdiff = this.wrapper.clientHeight - bcr.height;
-        this.frame.style.top = `${hdiff / 2}px`;
-        if(page === Page.left) {
-            const wdiff = this.wrapper.clientWidth - bcr.width;
-            this.frame.style.left = `${wdiff}px`;
-        } else if(page === Page.center) {
-            const wdiff = this.wrapper.clientWidth - bcr.width;
-            this.frame.style.left = `${wdiff / 2}px`;
+
+        if(isTypedOMSupported()) {
+            this.frame.attributeStyleMap.set("top", CSS.px(hdiff / 2));
+            if(page === Page.left) {
+                const wdiff = this.wrapper.clientWidth - bcr.width;
+                this.frame.attributeStyleMap.set("left", CSS.px(wdiff));
+            } else if(page === Page.center) {
+                const wdiff = this.wrapper.clientWidth - bcr.width;
+                this.frame.attributeStyleMap.set("left", CSS.px(wdiff / 2));
+            } else {
+                this.frame.attributeStyleMap.set("left", CSS.px(0));
+            }
         } else {
-            this.frame.style.left = "0px";
+            this.frame.style.top = `${hdiff / 2}px`;
+            if(page === Page.left) {
+                const wdiff = this.wrapper.clientWidth - bcr.width;
+                this.frame.style.left = `${wdiff}px`;
+            } else if(page === Page.center) {
+                const wdiff = this.wrapper.clientWidth - bcr.width;
+                this.frame.style.left = `${wdiff / 2}px`;
+            } else {
+                this.frame.style.left = "0px";
+            }
         }
 
         this.frame.style.removeProperty("visibility");
-        this.frame.style.removeProperty("aria-hidden");
+        this.frame.ariaHidden = null;
         this.frame.style.removeProperty("pointer-events");
         this.frame.classList.remove("blank");
         this.frame.classList.add("loaded");
@@ -171,7 +200,7 @@ export class FXLFrameManager {
         if(!this.loaded) return;
         this.deselect();
         this.frame.style.visibility = "hidden";
-        this.frame.style.setProperty("aria-hidden", "true");
+        this.frame.ariaHidden = "true";
         this.frame.style.pointerEvents = "none";
         this.frame.classList.add("blank");
         this.frame.classList.remove("loaded");
@@ -189,6 +218,8 @@ export class FXLFrameManager {
             this.source = "about:blank";
             this.frame.contentWindow!.location.replace("about:blank");
             this.frame.style.display = "none";
+            this.frame.style.width = "0px";
+            this.frame.style.height = "0px";
         });
     }
 
diff --git a/navigator/src/epub/fxl/FXLFramePoolManager.ts b/navigator/src/epub/fxl/FXLFramePoolManager.ts
index c129b207..214a0655 100644
--- a/navigator/src/epub/fxl/FXLFramePoolManager.ts
+++ b/navigator/src/epub/fxl/FXLFramePoolManager.ts
@@ -1,9 +1,9 @@
 import { ModuleName } from "@readium/navigator-html-injectables";
-import { Locator, Publication, ReadingProgression, Page, Link } from "@readium/shared";
+import { Locator, Publication, ReadingProgression, Page, Link, Layout } from "@readium/shared";
 import { FrameCommsListener } from "../frame/index.ts";
-import FrameBlobBuider from "../frame/FrameBlobBuilder.ts";
+import FrameBlobBuilder from "../frame/FrameBlobBuilder.ts";
 import { FXLFrameManager } from "./FXLFrameManager.ts";
-import { FXLPeripherals } from "./FXLPeripherals.ts";
+import { FXLPeripherals, isTypedOMSupported } from "./FXLPeripherals.ts";
 import { FXLSpreader, Orientation, Spread } from "./FXLSpreader.ts";
 import { VisualNavigatorViewport, IContentProtectionConfig, IKeyboardPeripheralsConfig } from "../../Navigator.ts";
 import { Injector } from "../../injection/Injector.ts";
@@ -21,7 +21,7 @@ export class FXLFramePoolManager {
     private readonly container: HTMLElement;
     private readonly positions: Locator[];
     private readonly pool: Map<string, FXLFrameManager> = new Map();
-    private readonly blobs: Map<string, string> = new Map();
+    private readonly blobs: Map<string, FrameBlobBuilder> = new Map();
     private readonly inprogress: Map<string, Promise<void>> = new Map();
     private readonly delayedShow: Map<string, Promise<void>> = new Map();
     private readonly delayedTimeout: Map<string, number> = new Map();
@@ -37,7 +37,7 @@ export class FXLFramePoolManager {
     private readonly pub: Publication;
     public width: number = 0;
     public height: number = 0;
-    private transform: string = "";
+    private transform: number | undefined;
     public currentSlide: number = 0;
     private spreader: FXLSpreader;
     private spread = true; // TODO
@@ -52,6 +52,7 @@ export class FXLFramePoolManager {
         container: HTMLElement,
         positions: Locator[],
         pub: Publication,
+        layout: Layout,
         injector?: Injector | null,
         contentProtectionConfig?: IContentProtectionConfig,
         keyboardPeripheralsConfig?: IKeyboardPeripheralsConfig,
@@ -64,10 +65,6 @@ export class FXLFramePoolManager {
         this.keyboardPeripheralsConfig = keyboardPeripheralsConfig || [];
         this.spreadPresentation = pub.metadata.otherMetadata?.spread || Spread.auto;
 
-        if(this.pub.metadata.effectiveReadingProgression !== ReadingProgression.rtl && this.pub.metadata.effectiveReadingProgression !== ReadingProgression.ltr)
-            // TODO support TTB and BTT
-            throw Error("Unsupported reading progression for EPUB");
-
         // NEW
         this.spreader = new FXLSpreader(this.pub);
         this.containerHeightCached = container.clientHeight;
@@ -86,16 +83,18 @@ export class FXLFramePoolManager {
 
         this.peripherals = new FXLPeripherals(this);
 
+        const fragment = document.createDocumentFragment();
         this.pub.readingOrder.items.forEach((link) => {
             // Create <iframe>
             const fm = new FXLFrameManager(this.peripherals, this.pub.metadata.effectiveReadingProgression, link.href, this.contentProtectionConfig, this.keyboardPeripheralsConfig);
-            this.spineElement.appendChild(fm.element);
 
-            // this.pages.push(fm);
             this.pool.set(link.href, fm);
             fm.width = 100 / this.length * (link.properties?.otherProperties["orientation"] === Orientation.landscape || link.properties?.otherProperties["addBlank"] ? this.perPage : 1);
             fm.height = this.height;
+            fragment.appendChild(fm.wrapper);
         });
+        this.spineElement.appendChild(fragment);
+
     }
 
     private _listener!: FrameCommsListener;
@@ -134,15 +133,18 @@ export class FXLFramePoolManager {
 
         clearTimeout(this.resizeTimeout);
         this.resizeTimeout = window.setTimeout(() => {
-            // TODO optimize this expensive set of loops and operations
+            const baseWidthFactor = 100 / this.length;
+            const itemLookup = new Map(this.pub.readingOrder.items.map(item => [item.href, item]));
             this.pool.forEach((frm, linkHref) => {
-                let i = this.pub.readingOrder.items.findIndex(l => l.href === linkHref);
-                const link = this.pub.readingOrder.items[i];
-                frm.width = 100 / this.length * (link.properties?.otherProperties["orientation"] === Orientation.landscape || link.properties?.otherProperties["addBlank"] ? this.perPage : 1);
-                frm.height = this.height;
-                if(!frm.loaded) return;
-                const spread = this.spreader.findByLink(link)!;
-                frm.update(this.spreadPosition(spread, link));
+                const link = itemLookup.get(linkHref);
+                if(!link) return;
+                requestAnimationFrame(() => {
+                    frm.width = baseWidthFactor * (link.properties?.otherProperties["orientation"] === Orientation.landscape || link.properties?.otherProperties["addBlank"] ? this.perPage : 1);
+                    frm.height = this.height;
+                    if(!frm.loaded) return;
+                    const spread = this.spreader.findByLink(link)!;
+                    frm.update(this.spreadPosition(spread, link));
+                });
             });
         }, RESIZE_UPDATE_TIMEOUT);
     }
@@ -181,23 +183,33 @@ export class FXLFramePoolManager {
     }
 
     public updateSpineStyle(animate: boolean, fast = true) {
-        let margin = "0";
+        let margin = 0;
         this.updateDimensions();
         if(this.perPage > 1 && true) // this.shift
-            margin = `${this.width / 2}px`;
-
-        const spineStyle = {
-            transition: animate ? `all ${fast ? SLIDE_FAST : SLIDE_SLOW}ms ease-out` : "all 0ms ease-out",
-            marginRight: this.rtl ? margin : "0",
-            marginLeft: this.rtl ? "0" : margin,
-            width: `${(this.width / this.perPage) * this.length}px`,
-            transform: this.transform,
-
-            // Static (should be moved to CSS)
-            contain: "content"
-        } as CSSStyleDeclaration;
-
-        Object.assign(this.spineElement.style, spineStyle);
+            margin = this.width / 2;
+
+        if(isTypedOMSupported()) {
+            // TODO: don't use UnparsedValue, but rather the longhand of every transition property
+            this.spineElement.attributeStyleMap.set("transition", new CSSUnparsedValue([animate ? `all ${fast ? SLIDE_FAST : SLIDE_SLOW}ms ease-out` : "all 0ms ease-out"]));
+            this.spineElement.attributeStyleMap.set("margin-right", CSS.px(this.rtl ? margin : 0));
+            this.spineElement.attributeStyleMap.set("margin-left", CSS.px(this.rtl ? 0 : margin));
+            this.spineElement.attributeStyleMap.set("width", CSS.px((this.width / this.perPage) * this.length));
+            this.transform ? this.spineElement.attributeStyleMap.set("transform", new CSSTransformValue([
+                new CSSTranslate(CSS.px(this.transform || 0), CSS.px(0), CSS.px(0))
+            ])) : this.spineElement.attributeStyleMap.delete("transform");
+            this.spineElement.attributeStyleMap.set("contain", new CSSUnparsedValue(["content"]));
+        } else {
+            const spineStyle = {
+                transition: animate ? `all ${fast ? SLIDE_FAST : SLIDE_SLOW}ms ease-out` : "all 0ms ease-out",
+                marginRight: this.rtl ? `${this.width / 2}px` : "0",
+                marginLeft: this.rtl ? "0" : `${margin}px`,
+                width: `${(this.width / this.perPage) * this.length}px`,
+                transform: this.transform ? `translate3d(${this.transform}px, 0px, 0px)` : "",
+                // Static (should be moved to CSS)
+                contain: "content"
+            } as CSSStyleDeclaration;
+            Object.assign(this.spineElement.style, spineStyle);
+        }
     }
 
     public updateBookStyle(initial=false) {
@@ -218,7 +230,16 @@ export class FXLFramePoolManager {
             } as CSSStyleDeclaration;
             Object.assign(this.bookElement.style, bookStyle);
         }
-        this.bookElement.style.transform = `scale(${this.peripherals?.scale || 1})` + (this.peripherals ? ` translate3d(${this.peripherals.pan.translateX}px, ${this.peripherals.pan.translateY}px, 0px)` : "");
+        if(isTypedOMSupported()) {
+            this.bookElement.attributeStyleMap.set("transform", new CSSTransformValue([
+                new CSSScale(this.peripherals?.scale || 1, this.peripherals?.scale || 1),
+                this.peripherals ? new CSSTranslate(
+                    CSS.px(this.peripherals.pan.translateX), CSS.px(this.peripherals.pan.translateY), CSS.px(0)
+                ) : new CSSTranslate(CSS.px(0), CSS.px(0), CSS.px(0))
+            ]));
+        } else {
+            this.bookElement.style.transform = `scale(${this.peripherals?.scale || 1})` + (this.peripherals ? ` translate3d(${this.peripherals.pan.translateX}px, ${this.peripherals.pan.translateY}px, 0px)` : "");
+        }
     }
 
     /**
@@ -289,7 +310,7 @@ export class FXLFramePoolManager {
                 requestAnimationFrame(() => {
                     const newTransform = `translate3d(${this.offset}px, 0, 0)`;
                     if(this.spineElement.style.transform === newTransform) return;
-                    this.transform = newTransform;
+                    this.transform = this.offset;
                     this.updateSpineStyle(true, fast);
                     this.deselect();
                 });
@@ -297,7 +318,7 @@ export class FXLFramePoolManager {
         } else {
             const newTransform = `translate3d(${this.offset}px, 0, 0)`;
             if(this.spineElement.style.transform === newTransform) return;
-            this.transform = newTransform;
+            this.transform = this.offset;
             this.updateSpineStyle(false);
             this.deselect();
         }
@@ -305,10 +326,10 @@ export class FXLFramePoolManager {
 
     bounce(rtl = false) {
         requestAnimationFrame(() => {
-            this.transform = `translate3d(${this.offset+(50 * (rtl ? 1 : -1))}px, 0, 0)`;
+            this.transform = this.offset + (50 * (rtl ? 1 : -1));
             this.updateSpineStyle(true, true);
             setTimeout(() => {
-                this.transform = `translate3d(${this.offset}px, 0, 0)`;
+                this.transform = this.offset;
                 this.updateSpineStyle(true, true);
             }, 100);
         });
@@ -405,7 +426,8 @@ export class FXLFramePoolManager {
         this.pool.clear();
 
         // Revoke all blobs
-        this.blobs.forEach(v => URL.revokeObjectURL(v));
+        this.blobs.forEach(v => v.reset());
+        this.blobs.clear();
 
         // Clean up injector if it exists
         this.injector?.dispose();
@@ -496,13 +518,13 @@ export class FXLFramePoolManager {
                 if(!this.pool.has(href)) return;
                 this.cancelShowing(href);
                 await this.pool.get(href)?.unload();
-                // this.pool.delete(href);
+                this.blobs.get(href)?.reset();
             });
 
             // Check if base URL of publication has changed
             if(this.currentBaseURL !== undefined && pub.baseURL !== this.currentBaseURL) {
                 // Revoke all blobs
-                this.blobs.forEach(v => URL.revokeObjectURL(v));
+                this.blobs.forEach(v => v.reset());
                 this.blobs.clear();
             }
             this.currentBaseURL = pub.baseURL;
@@ -512,16 +534,14 @@ export class FXLFramePoolManager {
                 const itm = pub.readingOrder.items[index];
                 if(!itm) return; // TODO throw?
                 if(!this.blobs.has(href)) {
-                    const blobBuilder = new FrameBlobBuider(
+                    this.blobs.set(href, new FrameBlobBuilder(
                         pub,
                         this.currentBaseURL || "",
                         itm,
                         {
                             injector: this.injector
                         }
-                    );
-                    const blobURL = await blobBuilder.build(true);
-                    this.blobs.set(href, blobURL);
+                    ));
                 }
 
                 // Show future offscreen frame in advance after a delay
@@ -535,7 +555,7 @@ export class FXLFramePoolManager {
                             const spread = this.makeSpread(this.reAlign(index));
                             const page = this.spreadPosition(spread, itm);
                             const fm = this.pool.get(href)!;
-                            await fm.load(modules, this.blobs.get(href)!);
+                            await fm.load(modules, await this.blobs.get(href)!.build(true));
                             if(!this.peripherals.isScaled) // When scaled, positioning is screwed up, so wait to show
                                 await fm.show(page); // Show/activate new frame
                             this.delayedShow.delete(href);
@@ -559,10 +579,10 @@ export class FXLFramePoolManager {
             for (const s of spread) {
                 const newFrame = this.pool.get(s.href)!;
                 const source = this.blobs.get(s.href);
-                if(!source) continue; // This can get destroyed
+                if(!source) continue; // Thfis can get destroyed
 
                 this.cancelShowing(s.href);
-                await newFrame.load(modules, source); // In order to ensure modules match the latest configuration
+                await newFrame.load(modules, await source.build(true)); // In order to ensure modules match the latest configuration
                 await newFrame.show(this.spreadPosition(spread, s)); // Show/activate new frame
                 this.previousFrames.push(newFrame);
                 await newFrame.activate();
diff --git a/navigator/src/epub/fxl/FXLPeripherals.ts b/navigator/src/epub/fxl/FXLPeripherals.ts
index d1efea40..3f3f3566 100644
--- a/navigator/src/epub/fxl/FXLPeripherals.ts
+++ b/navigator/src/epub/fxl/FXLPeripherals.ts
@@ -35,6 +35,8 @@ export interface Zoomer {
     };
 }
 
+export const isTypedOMSupported = () => typeof window.CSSTransformValue !== 'undefined';
+
 export class FXLPeripherals {
 
     private readonly manager: FXLFramePoolManager;
@@ -498,7 +500,17 @@ export class FXLPeripherals {
             cancelAnimationFrame(this.moveFrame);
             this.moveFrame = requestAnimationFrame(() => {
                 requestAnimationFrame(() => {
-                    this.manager.spineElement.style.transform = `translate3d(${(this.manager.rtl ? 1 : -1) * offset}px, 0, 0)`;
+                    if(isTypedOMSupported()) {
+                        this.manager.spineElement.attributeStyleMap.set("transform", new CSSTransformValue([
+                            new CSSTranslate(
+                                CSS.px((this.manager.rtl ? 1 : -1) * offset), 
+                                CSS.px(0),
+                                CSS.px(0)
+                            )
+                        ]));
+                    } else {
+                        this.manager.spineElement.style.transform = `translate3d(${(this.manager.rtl ? 1 : -1) * offset}px, 0, 0)`;
+                    }
                 })
             });
         }
diff --git a/navigator/src/webpub/WebPubFrameManager.ts b/navigator/src/webpub/WebPubFrameManager.ts
index 1dffa3e7..ea81925a 100644
--- a/navigator/src/webpub/WebPubFrameManager.ts
+++ b/navigator/src/webpub/WebPubFrameManager.ts
@@ -25,7 +25,7 @@ export class WebPubFrameManager {
         this.frame = document.createElement("iframe");
         this.frame.classList.add("readium-navigator-iframe");
         this.frame.style.visibility = "hidden";
-        this.frame.style.setProperty("aria-hidden", "true");
+        this.frame.ariaHidden = "true";
         this.frame.style.opacity = "0";
         this.frame.style.position = "absolute";
         this.frame.style.pointerEvents = "none";
@@ -109,7 +109,7 @@ export class WebPubFrameManager {
     async hide(): Promise<void> {
         if(this.destroyed) return;
         this.frame.style.visibility = "hidden";
-        this.frame.style.setProperty("aria-hidden", "true");
+        this.frame.ariaHidden = "true";
         this.frame.style.opacity = "0";
         this.frame.style.pointerEvents = "none";
         this.hidden = true;
@@ -140,7 +140,7 @@ export class WebPubFrameManager {
                     this.applyContentProtection();
                     const remove = () => {
                         this.frame.style.removeProperty("visibility");
-                        this.frame.style.removeProperty("aria-hidden");
+                        this.frame.ariaHidden = null;
                         this.frame.style.removeProperty("opacity");
                         this.frame.style.removeProperty("pointer-events");
                         this.hidden = false;
diff --git a/shared/package.json b/shared/package.json
index 6d0b698b..1a43667e 100644
--- a/shared/package.json
+++ b/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@readium/shared",
-  "version": "2.2.0",
+  "version": "2.2.0-alpha.2",
   "type": "module",
   "description": "Shared models to be used across other Readium projects and implementations in Typescript",
   "author": "readium",
diff --git a/shared/src/fetcher/HttpFetcher.ts b/shared/src/fetcher/HttpFetcher.ts
index bf6f2876..de36b2e8 100644
--- a/shared/src/fetcher/HttpFetcher.ts
+++ b/shared/src/fetcher/HttpFetcher.ts
@@ -108,7 +108,7 @@ export class HttpResource implements Resource {
     return await resp.text();
   }
 
-  async readAsXML(): Promise<XMLDocument> {
+  async readAsXML(): Promise<Document> {
     const resp = await this.client(this.url);
     if (!resp.ok)
       throw new Error(
@@ -116,7 +116,7 @@ export class HttpResource implements Resource {
       ); // TODO
     return new DOMParser().parseFromString(
       await resp.text(),
-      'application/xml'
+      this._link.mediaType.isHTML ? (this._link.mediaType.string as 'application/xhtml+xml' | 'text/html') : 'text/xml'
     );
   }
 }
diff --git a/shared/src/fetcher/Resource.ts b/shared/src/fetcher/Resource.ts
index 58154eb4..06eda354 100644
--- a/shared/src/fetcher/Resource.ts
+++ b/shared/src/fetcher/Resource.ts
@@ -27,11 +27,11 @@ export abstract class Resource {
       return JSON.parse(str);
     });
   }
-  readAsXML(): Promise<XMLDocument | undefined> {
-    return this.readAsString().then(str => {
+  readAsXML(): Promise<Document | undefined> {
+    return this.link().then(l => this.readAsString().then(str => {
       if (str === undefined) return str;
-      return new DOMParser().parseFromString(str, 'text/xml');
-    });
+      return new DOMParser().parseFromString(str, l.mediaType.isHTML ? (l.mediaType.string as 'application/xhtml+xml' | 'text/html') : 'text/xml');
+    }));
   }
   abstract close(): void;
 }
diff --git a/shared/src/publication/Manifest.ts b/shared/src/publication/Manifest.ts
index 32d69f36..58190d36 100644
--- a/shared/src/publication/Manifest.ts
+++ b/shared/src/publication/Manifest.ts
@@ -35,7 +35,7 @@ export class Manifest {
   constructor(values: {
     context?: Array<string>;
     metadata: Metadata;
-    links: Links;
+    links?: Links;
     readingOrder: Links;
     resources?: Links;
     toc?: Links;
@@ -43,7 +43,7 @@ export class Manifest {
   }) {
     this.context = values.context;
     this.metadata = values.metadata;
-    this.links = values.links;
+    this.links = values.links || new Links([]);
     this.readingOrder = values.readingOrder;
     this.resources = values.resources;
     this.toc = values.toc;
@@ -63,10 +63,6 @@ export class Manifest {
 
     if (!metadata) return;
 
-    const links = Links.deserialize(json.links);
-
-    if (!links) return;
-
     const readingOrder = Links.deserialize(
       json.readingOrder ? json.readingOrder : json.spine
     );
@@ -76,7 +72,7 @@ export class Manifest {
     return new Manifest({
       context: arrayfromJSONorString(json['@context']),
       metadata,
-      links,
+      links: Links.deserialize(json.links),
       readingOrder,
       resources: Links.deserialize(json.resources),
       toc: Links.deserialize(json.toc),
@@ -93,7 +89,7 @@ export class Manifest {
     const json: any = {};
     if (this.context !== undefined) json['@context'] = this.context;
     json.metadata = this.metadata.serialize();
-    json.links = this.links.serialize();
+    if (this.links?.items.length > 0) json.links = this.links.serialize();
     json.readingOrder = this.readingOrder.serialize();
     if (this.resources) json.resources = this.resources.serialize();
     if (this.toc) json.toc = this.toc.serialize();
@@ -108,7 +104,9 @@ export class Manifest {
     if (this.resources) {
       links.push(this.resources);
     }
-    links.push(this.links);
+    if(this.links) {
+      links.push(this.links);
+    }
 
     let result: Link | undefined;
 
@@ -129,7 +127,9 @@ export class Manifest {
     if (this.resources) {
       result.push(this.resources.filterByRel(rel));
     }
-    result.push(this.links.filterByRel(rel));
+    if(this.links) {
+      result.push(this.links.filterByRel(rel));
+    }
 
     return result.reduce((acc, val) => acc.concat(val), []);
   }
@@ -197,7 +197,9 @@ export class Manifest {
     if (this.resources) {
       links.push(this.resources);
     }
-    links.push(this.links);
+    if(this.links) {
+      links.push(this.links);
+    }
 
     const link = find(links);
 
diff --git a/shared/test/Manifest.test.ts b/shared/test/Manifest.test.ts
index b7485c5f..c3a7c397 100644
--- a/shared/test/Manifest.test.ts
+++ b/shared/test/Manifest.test.ts
@@ -137,7 +137,6 @@ describe('Manifest Tests', () => {
       }).serialize()
     ).toEqual({
       metadata: { title: { und: 'Title' } },
-      links: [],
       readingOrder: [],
     });
   });