PDF.js 深入浅出 3: getViewport & render

/**
 * @param {GetViewportParameters} params - Viewport parameters.
 * @returns {PageViewport} Contains 'width' and 'height' properties
 *   along with transforms required for rendering.
 */
getViewport({
  scale,
  rotation = this.rotate,
  offsetX = 0,
  offsetY = 0,
  dontFlip = false,
} = {}) {
  return new PageViewport({
    viewBox: this.view,
    userUnit: this.userUnit,
    scale,
    rotation,
    offsetX,
    offsetY,
    dontFlip,
  });
}

// Source: src/display/page_viewport.js
/**
 * @param {PageViewportParameters}
 */
constructor({
  viewBox,
  userUnit,
  scale,
  rotation,
  offsetX = 0,
  offsetY = 0,
  dontFlip = false,
}) {
  this.viewBox = viewBox;
  this.userUnit = userUnit;
  this.scale = scale;
  this.rotation = rotation;
  this.offsetX = offsetX;
  this.offsetY = offsetY;
 
  scale *= userUnit; // Take the userUnit into account.
 
  // creating transform to convert pdf coordinate system to the normal
  // canvas like coordinates taking in account scale and rotation
  const centerX = (viewBox[2] + viewBox[0]) / 2;
  const centerY = (viewBox[3] + viewBox[1]) / 2;
  let rotateA, rotateB, rotateC, rotateD;
  // Normalize the rotation, by clamping it to the [0, 360) range.
  rotation %= 360;
  if (rotation < 0) {
    rotation += 360;
  }
  switch (rotation) {
    case 180:
      rotateA = -1;
      rotateB = 0;
      rotateC = 0;
      rotateD = 1;
      break;
    case 90:
      rotateA = 0;
      rotateB = 1;
      rotateC = 1;
      rotateD = 0;
      break;
    case 270:
      rotateA = 0;
      rotateB = -1;
      rotateC = -1;
      rotateD = 0;
      break;
    case 0:
      rotateA = 1;
      rotateB = 0;
      rotateC = 0;
      rotateD = -1;
      break;
    default:
      throw new Error(
        "PageViewport: Invalid rotation, must be a multiple of 90 degrees."
      );
  }
 
  if (dontFlip) {
    rotateC = -rotateC;
    rotateD = -rotateD;
  }
 
  let offsetCanvasX, offsetCanvasY;
  let width, height;
  if (rotateA === 0) {
    offsetCanvasX = Math.abs(centerY - viewBox[1]) * scale + offsetX;
    offsetCanvasY = Math.abs(centerX - viewBox[0]) * scale + offsetY;
    width = (viewBox[3] - viewBox[1]) * scale;
    height = (viewBox[2] - viewBox[0]) * scale;
  } else {
    offsetCanvasX = Math.abs(centerX - viewBox[0]) * scale + offsetX;
    offsetCanvasY = Math.abs(centerY - viewBox[1]) * scale + offsetY;
    width = (viewBox[2] - viewBox[0]) * scale;
    height = (viewBox[3] - viewBox[1]) * scale;
  }
  // creating transform for the following operations:
  // translate(-centerX, -centerY), rotate and flip vertically,
  // scale, and translate(offsetCanvasX, offsetCanvasY)
  this.transform = [
    rotateA * scale,
    rotateB * scale,
    rotateC * scale,
    rotateD * scale,
    offsetCanvasX - rotateA * scale * centerX - rotateC * scale * centerY,
    offsetCanvasY - rotateB * scale * centerX - rotateD * scale * centerY,
  ];
 
  this.width = width;
  this.height = height;
}

case 0:
  rotateA = 1;
  rotateB = 0;
  rotateC = 0;
  rotateD = -1;

/**
 * Begins the process of rendering a page to the desired context.
 *
 * @param {RenderParameters} params - Page render parameters.
 * @returns {RenderTask} An object that contains a promise that is
 *   resolved when the page finishes rendering.
 */
render({
  canvasContext,
  canvas = canvasContext.canvas,
  viewport,
  intent = "display",
  annotationMode = AnnotationMode.ENABLE,
  transform = null,
  background = null,
  optionalContentConfigPromise = null,
  annotationCanvasMap = null,
  pageColors = null,
  printAnnotationStorage = null,
  isEditing = false,
  recordImages = false,
  recordOperations = false,
  operationsFilter = null,
}) {
  this._stats?.time("Overall");
 
  const intentArgs = this._transport.getRenderingIntent(
    intent,
    annotationMode,
    printAnnotationStorage,
    isEditing
  );
  const { renderingIntent, cacheKey } = intentArgs;
  // If there was a pending destroy, cancel it so no cleanup happens during
  // this call to render.
  this.#pendingCleanup = false;
 
  optionalContentConfigPromise ||=
    this._transport.getOptionalContentConfig(renderingIntent);
 
  const intentState = this._intentStates.getOrInsertComputed(
    cacheKey,
    makeObj
  );
  // Ensure that a pending `streamReader` cancel timeout is always aborted.
  if (intentState.streamReaderCancelTimeout) {
    clearTimeout(intentState.streamReaderCancelTimeout);
    intentState.streamReaderCancelTimeout = null;
  }
 
  const intentPrint = !!(renderingIntent & RenderingIntentFlag.PRINT);
 
  // If there's no displayReadyCapability yet, then the operatorList
  // was never requested before. Make the request and create the promise.
  if (!intentState.displayReadyCapability) {
    intentState.displayReadyCapability = Promise.withResolvers();
    intentState.operatorList = {
      fnArray: [],
      argsArray: [],
      lastChunk: false,
      separateAnnots: null,
    };
 
    this._stats?.time("Page Request");
    this._pumpOperatorList(intentArgs);
  }
 
  const recordForDebugger = !!(
    this._pdfBug && globalThis.StepperManager?.enabled
  );
  const shouldRecordOperations =
    !!canvas &&
    !this.recordedBBoxes &&
    (recordOperations || recordForDebugger);
  const shouldRecordImages =
    !!canvas && !this.imageCoordinates && recordImages;
 
  const complete = error => {
    intentState.renderTasks.delete(internalRenderTask);
 
    if (shouldRecordOperations) {
      const recordedBBoxes = internalRenderTask.gfx?.dependencyTracker.take();
      if (recordedBBoxes) {
        internalRenderTask.stepper?.setOperatorBBoxes(
          recordedBBoxes,
          internalRenderTask.gfx.dependencyTracker.takeDebugMetadata()
        );
 
        if (recordOperations) {
          this.recordedBBoxes = recordedBBoxes;
        }
      }
    }
 
    if (shouldRecordImages && !error) {
      this.imageCoordinates = internalRenderTask.gfx?.imagesTracker.take();
    }
 
    // Attempt to reduce memory usage during *printing*, by always running
    // cleanup immediately once rendering has finished.
    if (intentPrint) {
      this.#pendingCleanup = true;
    }
    this.#tryCleanup();
 
    if (error) {
      internalRenderTask.capability.reject(error);
 
      this._abortOperatorList({
        intentState,
        reason: error instanceof Error ? error : new Error(error),
      });
    } else {
      internalRenderTask.capability.resolve();
    }
 
    if (this._stats) {
      this._stats.timeEnd("Rendering");
      this._stats.timeEnd("Overall");
 
      if (globalThis.Stats?.enabled) {
        globalThis.Stats.add(this.pageNumber, this._stats);
      }
    }
  };
 
  let dependencyTracker = null;
  let bboxTracker = null;
  if (shouldRecordOperations || shouldRecordImages) {
    bboxTracker = new CanvasBBoxTracker(
      canvas,
      intentState.operatorList.length
    );
  }
  if (shouldRecordOperations) {
    dependencyTracker = new CanvasDependencyTracker(
      bboxTracker,
      recordForDebugger
    );
  }
 
  const internalRenderTask = new InternalRenderTask({
    callback: complete,
    // Only include the required properties, and *not* the entire object.
    params: {
      canvas,
      canvasContext,
      dependencyTracker: dependencyTracker ?? bboxTracker,
      imagesTracker: shouldRecordImages
        ? new CanvasImagesTracker(canvas)
        : null,
      viewport,
      transform,
      background,
    },
    objs: this.objs,
    commonObjs: this.commonObjs,
    annotationCanvasMap,
    operatorList: intentState.operatorList,
    pageIndex: this._pageIndex,
    canvasFactory: this._transport.canvasFactory,
    filterFactory: this._transport.filterFactory,
    useRequestAnimationFrame: !intentPrint,
    pdfBug: this._pdfBug,
    pageColors,
    enableHWA: this._transport.enableHWA,
    operationsFilter,
  });
 
  (intentState.renderTasks ||= new Set()).add(internalRenderTask);
  const renderTask = internalRenderTask.task;
 
  Promise.all([
    intentState.displayReadyCapability.promise,
    optionalContentConfigPromise,
  ])
    .then(([transparency, optionalContentConfig]) => {
      if (this.destroyed) {
        complete();
        return;
      }
      this._stats?.time("Rendering");
 
      if (!(optionalContentConfig.renderingIntent & renderingIntent)) {
        throw new Error(
          "Must use the same `intent`-argument when calling the `PDFPageProxy.render` " +
            "and `PDFDocumentProxy.getOptionalContentConfig` methods."
        );
      }
      internalRenderTask.initializeGraphics({
        transparency,
        optionalContentConfig,
      });
      internalRenderTask.operatorListChanged();
    })
    .catch(complete);
 
  return renderTask;
}

// If there's no displayReadyCapability yet, then the operatorList
// was never requested before. Make the request and create the promise.
if (!intentState.displayReadyCapability) {
  intentState.displayReadyCapability = Promise.withResolvers();
  intentState.operatorList = {
    fnArray: [],
    argsArray: [],
    lastChunk: false,
    separateAnnots: null,
  };
 
  this._stats?.time('Page Request');
  this._pumpOperatorList(intentArgs);
}

// Source: src/display/api.js
getRenderingIntent(
  intent,
  annotationMode = AnnotationMode.ENABLE,
  printAnnotationStorage = null,
  isEditing = false,
  isOpList = false
) {
  let renderingIntent = RenderingIntentFlag.DISPLAY; // Default value.
  let annotationStorageSerializable = SerializableEmpty;
 
  switch (intent) {
    case "any":
      renderingIntent = RenderingIntentFlag.ANY;
      break;
    case "display":
      break;
    case "print":
      renderingIntent = RenderingIntentFlag.PRINT;
      break;
    default:
      warn(`getRenderingIntent - invalid intent: ${intent}`);
  }
 
  const annotationStorage =
    renderingIntent & RenderingIntentFlag.PRINT &&
    printAnnotationStorage instanceof PrintAnnotationStorage
      ? printAnnotationStorage
      : this.annotationStorage;
 
  switch (annotationMode) {
    case AnnotationMode.DISABLE:
      renderingIntent += RenderingIntentFlag.ANNOTATIONS_DISABLE;
      break;
    case AnnotationMode.ENABLE:
      break;
    case AnnotationMode.ENABLE_FORMS:
      renderingIntent += RenderingIntentFlag.ANNOTATIONS_FORMS;
      break;
    case AnnotationMode.ENABLE_STORAGE:
      renderingIntent += RenderingIntentFlag.ANNOTATIONS_STORAGE;
 
      annotationStorageSerializable = annotationStorage.serializable;
      break;
    default:
      warn(`getRenderingIntent - invalid annotationMode: ${annotationMode}`);
  }
 
  if (isEditing) {
    renderingIntent += RenderingIntentFlag.IS_EDITING;
  }
  if (isOpList) {
    renderingIntent += RenderingIntentFlag.OPLIST;
  }
 
  const { ids: modifiedIds, hash: modifiedIdsHash } =
    annotationStorage.modifiedIds;
 
  const cacheKeyBuf = [
    renderingIntent,
    annotationStorageSerializable.hash,
    modifiedIdsHash,
  ];
 
  return {
    renderingIntent,
    cacheKey: cacheKeyBuf.join("_"),
    annotationStorageSerializable,
    modifiedIds,
  };
}

// Source: src/display/api.js
_pumpOperatorList({
  renderingIntent,
  cacheKey,
  annotationStorageSerializable,
  modifiedIds,
}) {
  if (typeof PDFJSDev === "undefined" || PDFJSDev.test("TESTING")) {
    assert(
      Number.isInteger(renderingIntent) && renderingIntent > 0,
      '_pumpOperatorList: Expected valid "renderingIntent" argument.'
    );
  }
  const { map, transfer } = annotationStorageSerializable;
 
  const readableStream = this._transport.messageHandler.sendWithStream(
    "GetOperatorList",
    {
      pageId: this.#pagesMapper.getPageId(this._pageIndex + 1) - 1,
      pageIndex: this._pageIndex,
      intent: renderingIntent,
      cacheKey,
      annotationStorage: map,
      modifiedIds,
    },
    /* queueingStrategy = */ undefined,
    transfer
  );
  const reader = readableStream.getReader();
 
  const intentState = this._intentStates.get(cacheKey);
  intentState.streamReader = reader;
 
  const pump = () => {
    reader.read().then(
      ({ value, done }) => {
        if (done) {
          intentState.streamReader = null;
          return;
        }
        if (this._transport.destroyed) {
          return; // Ignore any pending requests if the worker was terminated.
        }
        this._renderPageChunk(value, intentState);
        pump();
      },
      reason => {
        intentState.streamReader = null;
 
        if (this._transport.destroyed) {
          return; // Ignore any pending requests if the worker was terminated.
        }
        if (intentState.operatorList) {
          // Mark operator list as complete.
          intentState.operatorList.lastChunk = true;
 
          for (const internalRenderTask of intentState.renderTasks) {
            internalRenderTask.operatorListChanged();
          }
          this.#tryCleanup();
        }
 
        if (intentState.displayReadyCapability) {
          intentState.displayReadyCapability.reject(reason);
        } else if (intentState.opListReadCapability) {
          intentState.opListReadCapability.reject(reason);
        } else {
          throw reason;
        }
      }
    );
  };
  pump();
}

handler.on(
  'GetOperatorList',
  function ({ pageId, pageIndex, intent, cacheKey, annotationStorage, modifiedIds }, sink) {
    pdfManager.getPage(pageId).then(function (page) {
      const task = new WorkerTask(`GetOperatorList: page ${pageIndex}`);
      startWorkerTask(task);
 
      // NOTE: Keep this condition in sync with the `info` helper function.
      const start = verbosity >= VerbosityLevel.INFOS ? Date.now() : 0;
 
      // Pre compile the pdf page and fetch the fonts/images.
      page
        .getOperatorList({
          handler,
          sink,
          task,
          intent,
          cacheKey,
          annotationStorage,
          modifiedIds,
          pageIndex,
        })
        .then(
          opListInfo => {
            if (start) {
              info(`${task.name}; time=${Date.now() - start}ms, len=${opListInfo.length}`);
            }
            sink.close();
          },
          reason => {
            if (task.terminated) {
              return; // ignoring errors from the terminated thread
            }
            sink.error(reason);
          },
        )
        .finally(() => {
          finishWorkerTask(task);
        });
    });
  },
);

getPage(pageIndex) {
  return this.pdfDocument.getPage(pageIndex);
}

this.pdfDocument = new PDFDocument(this, this.streamManager.getStream());

constructor(pdfManager, stream) {
  if (typeof PDFJSDev === "undefined" || PDFJSDev.test("TESTING")) {
    assert(
      stream instanceof BaseStream,
      'PDFDocument: Invalid "stream" argument.'
    );
  }
  if (stream.length <= 0) {
    throw new InvalidPDFException(
      "The PDF file is empty, i.e. its size is zero bytes."
    );
  }
 
  this.pdfManager = pdfManager;
  this.stream = stream;
  this.xref = new XRef(stream, pdfManager);
 
  const idCounters = {
    font: 0,
  };
  this._globalIdFactory = class {
    static getDocId() {
      return `g_${pdfManager.docId}`;
    }
 
    static createFontId() {
      return `f${++idCounters.font}`;
    }
 
    static createObjId() {
      unreachable("Abstract method `createObjId` called.");
    }
 
    static getPageObjId() {
      unreachable("Abstract method `getPageObjId` called.");
    }
  };
}

getPage(pageIndex) {
  const cachedPromise = this.#pagePromises.get(pageIndex);
  if (cachedPromise) {
    return cachedPromise;
  }
  const { catalog, linearization, xfaFactory } = this;
 
  let promise;
  if (xfaFactory) {
    promise = Promise.resolve([Dict.empty, null]);
  } else if (linearization?.pageFirst === pageIndex) {
    promise = this.#getLinearizationPage(pageIndex);
  } else {
    promise = catalog.getPageDict(pageIndex);
  }
  promise = promise.then(
    ([pageDict, ref]) =>
      new Page({
        pdfManager: this.pdfManager,
        xref: this.xref,
        pageIndex,
        pageDict,
        ref,
        globalIdFactory: this._globalIdFactory,
        fontCache: catalog.fontCache,
        builtInCMapCache: catalog.builtInCMapCache,
        standardFontDataCache: catalog.standardFontDataCache,
        globalColorSpaceCache: catalog.globalColorSpaceCache,
        globalImageCache: catalog.globalImageCache,
        systemFontCache: catalog.systemFontCache,
        nonBlendModesSet: catalog.nonBlendModesSet,
        xfaFactory,
      })
  );
 
  this.#pagePromises.set(pageIndex, promise);
  return promise;
}

// Pre compile the pdf page and fetch the fonts/images.
page
  .getOperatorList({
    handler,
    sink,
    task,
    intent,
    cacheKey,
    annotationStorage,
    modifiedIds,
    pageIndex,
  })
  .then(
    opListInfo => {
      if (start) {
        info(`${task.name}; time=${Date.now() - start}ms, len=${opListInfo.length}`);
      }
      sink.close();
    },
    reason => {
      if (task.terminated) {
        return; // ignoring errors from the terminated thread
      }
      sink.error(reason);
    },
  )
  .finally(() => {
    finishWorkerTask(task);
  });

// Source: src/core/document.js
async getOperatorList({
  handler,
  sink,
  task,
  intent,
  cacheKey,
  pageIndex = this.pageIndex,
  annotationStorage = null,
  modifiedIds = null,
}) {
  const contentStreamPromise = this.getContentStream();
  const resourcesPromise = this.loadResources(RESOURCES_KEYS_OPERATOR_LIST);
  // ...
 
  const pageListPromise = Promise.all([
    contentStreamPromise,
    resourcesPromise,
  ]).then(async ([contentStream]) => {
    const resources = await this.#getMergedResources(
      contentStream.dict,
      RESOURCES_KEYS_OPERATOR_LIST
    );
    const opList = new OperatorList(intent, sink);
    handler.send("StartRenderPage", {
      transparency: partialEvaluator.hasBlendModes(
        resources,
        this.nonBlendModesSet
      ),
      pageIndex,
      cacheKey,
    });
 
    await partialEvaluator.getOperatorList({
      stream: contentStream,
      task,
      resources,
      operatorList: opList,
    });
    return opList;
  });
  // ...

messageHandler.on('StartRenderPage', data => {
  if (this.destroyed) {
    return; // Ignore any pending requests if the worker was terminated.
  }
 
  const page = this.#pageCache.get(data.pageIndex);
  page._startRenderPage(data.transparency, data.cacheKey);
});

/**
 * @private
 */
_startRenderPage(transparency, cacheKey) {
  const intentState = this._intentStates.get(cacheKey);
  if (!intentState) {
    return; // Rendering was cancelled.
  }
  this._stats?.timeEnd("Page Request");
 
  // TODO Refactor RenderPageRequest to separate rendering
  // and operator list logic
  intentState.displayReadyCapability?.resolve(transparency);
}

intentState.streamReader = reader;
 
const pump = () => {
  reader.read().then(
    ({ value, done }) => {
      if (done) {
        intentState.streamReader = null;
        return;
      }
      if (this._transport.destroyed) {
        return; // Ignore any pending requests if the worker was terminated.
      }
      this._renderPageChunk(value, intentState);
      pump();
    },
    reason => {
      intentState.streamReader = null;
 
      if (this._transport.destroyed) {
        return; // Ignore any pending requests if the worker was terminated.
      }
      if (intentState.operatorList) {
        // Mark operator list as complete.
        intentState.operatorList.lastChunk = true;
 
        for (const internalRenderTask of intentState.renderTasks) {
          internalRenderTask.operatorListChanged();
        }
        this.#tryCleanup();
      }
 
      if (intentState.displayReadyCapability) {
        intentState.displayReadyCapability.reject(reason);
      } else if (intentState.opListReadCapability) {
        intentState.opListReadCapability.reject(reason);
      } else {
        throw reason;
      }
    },
  );
};
pump();

_renderPageChunk(operatorListChunk, intentState) {
  // Add the new chunk to the current operator list.
  for (let i = 0, ii = operatorListChunk.length; i < ii; i++) {
    intentState.operatorList.fnArray.push(operatorListChunk.fnArray[i]);
    intentState.operatorList.argsArray.push(operatorListChunk.argsArray[i]);
  }
  intentState.operatorList.lastChunk = operatorListChunk.lastChunk;
  intentState.operatorList.separateAnnots = operatorListChunk.separateAnnots;
 
  // Notify all the rendering tasks there are more operators to be consumed.
  for (const internalRenderTask of intentState.renderTasks) {
    internalRenderTask.operatorListChanged();
  }
 
  if (operatorListChunk.lastChunk) {
    this.#tryCleanup();
  }
}

operatorListChanged() {
  if (!this.graphicsReady) {
    this.graphicsReadyCallback ||= this._continueBound;
    return;
  }
  this.gfx.dependencyTracker?.growOperationsCount(
    this.operatorList.fnArray.length
  );
  this.stepper?.updateOperatorList(this.operatorList);
 
  if (this.running) {
    return;
  }
  this._continue();
}

_continue() {
  this.running = true;
  if (this.cancelled) {
    return;
  }
  if (this.task.onContinue) {
    this.task.onContinue(this._scheduleNextBound);
  } else {
    this._scheduleNext();
  }
}

_scheduleNext() {
  if (this._useRequestAnimationFrame) {
    this.#rAF = window.requestAnimationFrame(() => {
      this.#rAF = null;
      this._nextBound().catch(this._cancelBound);
    });
  } else {
    Promise.resolve().then(this._nextBound).catch(this._cancelBound);
  }
}

async _next() {
  if (this.cancelled) {
    return;
  }
  this.operatorListIdx = this.gfx.executeOperatorList(
    this.operatorList,
    this.operatorListIdx,
    this._continueBound,
    this.stepper,
    this._operationsFilter
  );
  if (this.operatorListIdx === this.operatorList.argsArray.length) {
    this.running = false;
    if (this.operatorList.lastChunk) {
      this.gfx.endDrawing();
      InternalRenderTask.#canvasInUse.delete(this._canvas);
      this.callback();
    }
  }
}

// Source: src/display/api.js (InternalRenderTask)
initializeGraphics({ transparency = false, optionalContentConfig }) {
  if (this.cancelled) {
    return;
  }
  if (this._canvas) {
    if (InternalRenderTask.#canvasInUse.has(this._canvas)) {
      throw new Error(
        "Cannot use the same canvas during multiple render() operations. " +
          "Use different canvas or ensure previous operations were " +
          "cancelled or completed."
      );
    }
    InternalRenderTask.#canvasInUse.add(this._canvas);
  }
 
  if (this._pdfBug && globalThis.StepperManager?.enabled) {
    this.stepper = globalThis.StepperManager.create(this._pageIndex);
    this.stepper.init(this.operatorList);
    this.stepper.nextBreakPoint = this.stepper.getNextBreakPoint();
  }
  const {
    viewport,
    transform,
    background,
    dependencyTracker,
    imagesTracker,
  } = this.params;
 
  // When printing in Firefox, we get a specific context in mozPrintCallback
  // which cannot be created from the canvas itself.
  const canvasContext =
    this._canvasContext ||
    this._canvas.getContext("2d", {
      alpha: false,
      willReadFrequently: !this._enableHWA,
    });
 
  this.gfx = new CanvasGraphics(
    canvasContext,
    this.commonObjs,
    this.objs,
    this.canvasFactory,
    this.filterFactory,
    { optionalContentConfig },
    this.annotationCanvasMap,
    this.pageColors,
    dependencyTracker,
    imagesTracker
  );
  this.gfx.beginDrawing({
    transform,
    viewport,
    transparency,
    background,
  });
  this.operatorListIdx = 0;
  this.graphicsReady = true;
  this.graphicsReadyCallback?.();
}

Main 线程 (PDFPageProxy.render)
  |-- getRenderingIntent            计算渲染意图, 生成缓存 key
  |-- _intentStates.getOrInsert...  基于缓存 key 获取或创建渲染状态
  |-- _pumpOperatorList             向 Worker 发起 GetOperatorList 流式请求
  |     `-- reader.read() 循环消费 chunk, 每次交给 _renderPageChunk
  |-- new InternalRenderTask        创建渲染任务, 挂入 renderTasks
  `-- await displayReadyCapability
        `-- initializeGraphics      创建 CanvasGraphics, beginDrawing
              `-- operatorListChanged -> _next -> gfx.executeOperatorList
 
Worker 线程 (on:GetOperatorList)
  |-- pdfManager.getPage            定位 Page
  `-- Page.getOperatorList
        |-- handler.send("StartRenderPage")    resolve displayReadyCapability
        `-- partialEvaluator.getOperatorList   解析出算子, 经 sink 分块回传