@univerjs/engine-render 0.1.0-alpha.2 → 0.1.0-alpha.3

package/lib/types/components/sheets/extensions/font.d.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import type { IColorStyle, IScale } from '@univerjs/core';
+import type { IColorStyle, IRange, IScale } from '@univerjs/core';
 import { ObjectMatrix } from '@univerjs/core';
 import type { SpreadsheetSkeleton } from '../sheet-skeleton';
 import { SheetExtension } from './sheet-extension';
@@ -23,7 +23,7 @@ export declare class Font extends SheetExtension {
     changeFontColor: ObjectMatrix<IColorStyle>;
     getDocuments(): any;
     setChangeFontColor(r: number, c: number, color: IColorStyle): void;
-    draw(ctx: CanvasRenderingContext2D, parentScale: IScale, spreadsheetSkeleton: SpreadsheetSkeleton): void;
+    draw(ctx: CanvasRenderingContext2D, parentScale: IScale, spreadsheetSkeleton: SpreadsheetSkeleton, diffRanges?: IRange[]): void;
     private _renderDocuments;
     private _clipRectangle;
 }

package/lib/types/components/sheets/extensions/index.d.ts

@@ -15,7 +15,6 @@
  */
 export * from './background';
 export * from './border';
-export * from './border-auxiliary';
 export * from './column-header-layout';
 export * from './font';
 export * from './row-header-layout';

package/lib/types/components/sheets/extensions/sheet-extension.d.ts

@@ -19,7 +19,10 @@ import type { SpreadsheetSkeleton } from '../sheet-skeleton';
 export declare enum SHEET_EXTENSION_TYPE {
     GRID = 0
 }
-export declare class SheetExtension extends ComponentExtension<SpreadsheetSkeleton, SHEET_EXTENSION_TYPE> {
+export declare class SheetExtension extends ComponentExtension<SpreadsheetSkeleton, SHEET_EXTENSION_TYPE, IRange[]> {
     type: SHEET_EXTENSION_TYPE;
     getCellIndex(rowIndex: number, columnIndex: number, rowHeightAccumulation: number[], columnWidthAccumulation: number[], dataMergeCache: IRange[]): import("@univerjs/core").ISelectionCellWithCoord;
+    isRenderDiffRangesByCell(row: number, column: number, diffRanges?: IRange[]): boolean;
+    isRenderDiffRangesByColumn(column: number, diffRanges?: IRange[]): boolean;
+    isRenderDiffRangesByRow(row: number, diffRanges?: IRange[]): boolean;
 }

package/lib/types/components/sheets/interfaces.d.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import type { BorderStyleTypes, HorizontalAlign, ObjectMatrix, VerticalAlign, WrapStrategy } from '@univerjs/core';
+import type { BorderStyleTypes, HorizontalAlign, ISelectionCellWithCoord, ObjectMatrix, VerticalAlign, WrapStrategy } from '@univerjs/core';
 import type { BORDER_TYPE } from '../../basics/const';
 import type { DocumentSkeleton } from '../docs/doc-skeleton';
 export interface BorderCache {
@@ -39,6 +39,7 @@ interface fontCache {
 }
 export interface IStylesCache {
     background?: backgroundCache;
+    backgroundPositions?: ObjectMatrix<ISelectionCellWithCoord>;
     font?: fontCache;
     border?: ObjectMatrix<BorderCache>;
 }

package/lib/types/components/sheets/row-header.d.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import type { IBoundRect, Vector2 } from '../../basics/vector2';
+import type { IViewportBound, Vector2 } from '../../basics/vector2';
 import type { RowHeaderLayout } from './extensions/row-header-layout';
 import { SpreadsheetHeader } from './sheet-component';
 import type { SpreadsheetSkeleton } from './sheet-skeleton';
@@ -21,7 +21,7 @@ export declare class SpreadsheetRowHeader extends SpreadsheetHeader {
     private _rowHeaderLayoutExtension;
     constructor(oKey: string, spreadsheetSkeleton?: SpreadsheetSkeleton);
     get rowHeaderLayoutExtension(): RowHeaderLayout;
-    draw(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): void;
+    draw(ctx: CanvasRenderingContext2D, bounds?: IViewportBound): void;
     isHit(coord: Vector2): boolean;
     private _initialDefaultExtension;
 }

package/lib/types/components/sheets/sheet-component.d.ts

@@ -13,20 +13,20 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import type { Nullable } from '@univerjs/core';
-import type { IBoundRect, Vector2 } from '../../basics/vector2';
+import type { IRange, Nullable } from '@univerjs/core';
+import type { IViewportBound, Vector2 } from '../../basics/vector2';
 import { RenderComponent } from '../component';
 import type { SHEET_EXTENSION_TYPE } from './extensions/sheet-extension';
 import type { SpreadsheetSkeleton } from './sheet-skeleton';
-export declare class SheetComponent extends RenderComponent<SpreadsheetSkeleton, SHEET_EXTENSION_TYPE> {
+export declare class SheetComponent extends RenderComponent<SpreadsheetSkeleton, SHEET_EXTENSION_TYPE, IRange[]> {
     private _skeleton?;
     constructor(oKey: string, _skeleton?: SpreadsheetSkeleton | undefined);
     getSkeleton(): SpreadsheetSkeleton | undefined;
     updateSkeleton(spreadsheetSkeleton: SpreadsheetSkeleton): void;
-    render(mainCtx: CanvasRenderingContext2D, bounds?: IBoundRect): this | undefined;
+    render(mainCtx: CanvasRenderingContext2D, bounds?: IViewportBound): this | undefined;
     getParentScale(): {
-        scaleX: any;
-        scaleY: any;
+        scaleX: number;
+        scaleY: number;
     };
     getDocuments(): any;
     getNoMergeCellPositionByIndex(rowIndex: number, columnIndex: number): Nullable<{
@@ -45,8 +45,8 @@ export declare class SheetComponent extends RenderComponent<SpreadsheetSkeleton,
         endRow: number;
         endColumn: number;
     }>;
-    protected _draw(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): void;
+    protected _draw(ctx: CanvasRenderingContext2D, bounds?: IViewportBound): void;
 }
 export declare class SpreadsheetHeader extends SheetComponent {
-    protected _draw(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): void;
+    protected _draw(ctx: CanvasRenderingContext2D, bounds?: IViewportBound): void;
 }

package/lib/types/components/sheets/sheet-skeleton.d.ts

@@ -15,7 +15,7 @@
  */
 import type { ICellData, IPaddingData, IRange, ISelectionCellWithCoord, ITextRotation, IWorksheetData, LocaleService, Nullable, Styles, Worksheet } from '@univerjs/core';
 import { BooleanNumber, DocumentDataModel, HorizontalAlign, ObjectMatrix, VerticalAlign, WrapStrategy } from '@univerjs/core';
-import type { IBoundRect } from '../../basics/vector2';
+import type { IBoundRectNoAngle, IViewportBound } from '../../basics/vector2';
 import { DocumentSkeleton } from '../docs/doc-skeleton';
 import { Skeleton } from '../skeleton';
 import type { IStylesCache } from './interfaces';
@@ -68,7 +68,7 @@ export declare class SpreadsheetSkeleton extends Skeleton {
     private _showGridlines;
     private _marginTop;
     private _marginLeft;
-    constructor(_worksheet: Worksheet | undefined, _config: IWorksheetData, _cellData: ObjectMatrix<ICellData>, _styles: Styles, _localeService: LocaleService);
+    constructor(_worksheet: Worksheet | undefined, _config: IWorksheetData, _cellData: ObjectMatrix<Nullable<ICellData>>, _styles: Styles, _localeService: LocaleService);
     get rowHeightAccumulation(): number[];
     get rowTotalHeight(): number;
     get columnWidthAccumulation(): number[];
@@ -91,7 +91,7 @@ export declare class SpreadsheetSkeleton extends Skeleton {
      * @param LocaleService
      * @returns
      */
-    static create(worksheet: Worksheet | undefined, config: IWorksheetData, cellData: ObjectMatrix<ICellData>, styles: Styles, LocaleService: LocaleService): SpreadsheetSkeleton;
+    static create(worksheet: Worksheet | undefined, config: IWorksheetData, cellData: ObjectMatrix<Nullable<ICellData>>, styles: Styles, LocaleService: LocaleService): SpreadsheetSkeleton;
     /**
      * @deprecated should never expose a property that is provided by another module!
      * @returns
@@ -101,7 +101,7 @@ export declare class SpreadsheetSkeleton extends Skeleton {
      * @deprecated should never expose a property that is provided by another module!
      * @returns
      */
-    getCellData(): ObjectMatrix<ICellData>;
+    getCellData(): ObjectMatrix<Nullable<ICellData>>;
     /**
      * @deprecated should never expose a property that is provided by another module!
      * @returns
@@ -110,13 +110,19 @@ export declare class SpreadsheetSkeleton extends Skeleton {
     setOverflowCache(value: ObjectMatrix<IRange>): void;
     setMarginLeft(left: number): void;
     setMarginTop(top: number): void;
-    calculateSegment(bounds?: IBoundRect): true | undefined;
-    calculateWithoutClearingCache(bounds?: IBoundRect): this | undefined;
-    calculate(bounds?: IBoundRect): this;
+    calculateSegment(bounds?: IViewportBound): true | undefined;
+    calculateWithoutClearingCache(bounds?: IViewportBound): this | undefined;
+    calculate(bounds?: IViewportBound): this;
     calculateAutoHeightInRange(ranges: Nullable<IRange[]>): IRowAutoHeightInfo[];
     private _calculateRowAutoHeight;
     updateLayout(): this | undefined;
-    getRowColumnSegment(bounds?: IBoundRect): {
+    getRowColumnSegment(bounds?: IViewportBound): {
+        startRow: number;
+        endRow: number;
+        startColumn: number;
+        endColumn: number;
+    };
+    getRowColumnSegmentByViewBound(bound?: IBoundRectNoAngle): {
         startRow: number;
         endRow: number;
         startColumn: number;
@@ -228,7 +234,19 @@ export declare class SpreadsheetSkeleton extends Skeleton {
         endX: number;
         isMerged: boolean;
         isMergedMainCell: boolean;
-        mergeInfo: import("@univerjs/core").IRangeWithCoord;
+        mergeInfo: {
+            startX: number;
+            startY: number;
+            endX: number;
+            endY: number;
+            startColumn: number;
+            endColumn: number;
+            rangeType?: import("@univerjs/core").RANGE_TYPE | undefined;
+            startAbsoluteRefType?: import("@univerjs/core").AbsoluteRefType | undefined;
+            endAbsoluteRefType?: import("@univerjs/core").AbsoluteRefType | undefined;
+            startRow: number;
+            endRow: number;
+        };
     };
     convertTransformToOffsetX(offsetX: number, scaleX: number, scrollXY: {
         x: number;
@@ -260,7 +278,7 @@ export declare class SpreadsheetSkeleton extends Skeleton {
      * @param bounds The range of the visible area of the canvas
      * @returns The range cell index of the canvas visible area
      */
-    protected _getBounding(rowHeightAccumulation: number[], columnWidthAccumulation: number[], bounds?: IBoundRect): {
+    protected _getBounding(rowHeightAccumulation: number[], columnWidthAccumulation: number[], viewBound?: IBoundRectNoAngle): {
         startRow: number;
         endRow: number;
         startColumn: number;

package/lib/types/components/sheets/spreadsheet.d.ts

@@ -13,34 +13,32 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import type { IBoundRect } from '../../basics/vector2';
+import type { IViewportBound } from '../../basics/vector2';
 import { Vector2 } from '../../basics/vector2';
 import { Documents } from '../docs/document';
 import type { Background } from './extensions/background';
 import type { Border } from './extensions/border';
-import type { BorderAuxiliary } from './extensions/border-auxiliary';
 import type { Font } from './extensions/font';
 import { SheetComponent } from './sheet-component';
 import type { SpreadsheetSkeleton } from './sheet-skeleton';
 export declare class Spreadsheet extends SheetComponent {
     private _allowCache;
-    private _borderAuxiliaryExtension;
     private _backgroundExtension;
     private _borderExtension;
     private _fontExtension;
     private _cacheCanvas;
-    private _boundsCache;
-    private _cacheOffsetX;
-    private _cacheOffsetY;
-    private _hasSelection;
+    private _refreshIncrementalState;
+    private _forceDirty;
+    private _overflowCacheRuntime;
+    private _overflowCacheRuntimeRange;
+    private _overflowCacheRuntimeTimeout;
     private _documents;
     constructor(oKey: string, spreadsheetSkeleton?: SpreadsheetSkeleton, _allowCache?: boolean);
-    get borderAuxiliaryExtension(): BorderAuxiliary;
     get backgroundExtension(): Background;
     get borderExtension(): Border;
     get fontExtension(): Font;
     getDocuments(): Documents;
-    draw(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): void;
+    draw(ctx: CanvasRenderingContext2D, bounds?: IViewportBound): void;
     isHit(coord: Vector2): boolean;
     getNoMergeCellPositionByIndex(rowIndex: number, columnIndex: number): {
         startY: number;
@@ -52,6 +50,7 @@ export declare class Spreadsheet extends SheetComponent {
         x: number;
         y: number;
     };
+    makeForceDirty(state?: boolean): void;
     getAncestorScrollXY(offsetX: number, offsetY: number): {
         x: number;
         y: number;
@@ -62,11 +61,10 @@ export declare class Spreadsheet extends SheetComponent {
         endRow: number;
         endColumn: number;
     } | undefined;
-    render(mainCtx: CanvasRenderingContext2D, bounds?: IBoundRect): this;
-    resizeCacheCanvas(): void;
-    private _checkNewBounds;
-    protected _applyCache(ctx?: CanvasRenderingContext2D): void;
-    protected _draw(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): void;
+    render(mainCtx: CanvasRenderingContext2D, bounds?: IViewportBound): this | undefined;
+    private _resizeCacheCanvas;
+    protected _applyCache(ctx?: CanvasRenderingContext2D, sx?: number, sy?: number, sw?: number, sh?: number, dx?: number, dy?: number, dw?: number, dh?: number): void;
+    protected _draw(ctx: CanvasRenderingContext2D, bounds?: IViewportBound): void;
     private _getAncestorSize;
     private _getAncestorParent;
     private _initialDefaultExtension;
@@ -79,6 +77,10 @@ export declare class Spreadsheet extends SheetComponent {
      * Overflow on the left or right is aligned according to the text's horizontal alignment.
      */
     private _calculateOverflow;
-    private _differentBounds;
-    private _checkSheetDifferentBounds;
+    private _drawAuxiliary;
+    /**
+     * Clear the guide lines within a range in the table, to make room for merged cells and overflow.
+     */
+    private _clearRectangle;
+    private _clearBackground;
 }

package/lib/types/custom/custom-object.d.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { BaseObject } from '../base-object';
-import type { IBoundRect, Vector2 } from '../basics/vector2';
+import type { IViewportBound, Vector2 } from '../basics/vector2';
 export declare class CustomObject extends BaseObject {
     private _render;
     private _isHitCustom?;
@@ -22,6 +22,6 @@ export declare class CustomObject extends BaseObject {
     toJson(): {
         [x: string]: any;
     };
-    render(mainCtx: CanvasRenderingContext2D, bounds?: IBoundRect): this;
+    render(mainCtx: CanvasRenderingContext2D, bounds?: IViewportBound): this;
     isHit(coord: Vector2): boolean;
 }

package/lib/types/engine.d.ts

@@ -49,8 +49,8 @@ export declare class Engine extends ThinEngine<Scene> {
     private _pointerLeaveEvent;
     /** previous pointer position */
     private pointer;
-    private __mouseId;
-    private __isUsingFirefox;
+    private _mouseId;
+    private _isUsingFirefox;
     constructor(elemWidth?: number, elemHeight?: number);
     get width(): number;
     get height(): number;
@@ -106,5 +106,5 @@ export declare class Engine extends ThinEngine<Scene> {
     private _handlePointerAction;
     private _getWheelEventName;
     private _getPassive;
-    private __getPointerType;
+    private _getPointerType;
 }

package/lib/types/group.d.ts

@@ -16,7 +16,7 @@
 import { BaseObject } from './base-object';
 import type { CURSOR_TYPE } from './basics/const';
 import { RENDER_CLASS_TYPE } from './basics/const';
-import type { IBoundRect, Vector2 } from './basics/vector2';
+import type { IViewportBound, Vector2 } from './basics/vector2';
 export declare class Group extends BaseObject {
     private _objects;
     constructor(key?: string, ...objects: BaseObject[]);
@@ -27,7 +27,7 @@ export declare class Group extends BaseObject {
     removeObject(object: BaseObject | string): void;
     getObjectsByOrder(): BaseObject[];
     getObjects(): BaseObject[];
-    render(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): void;
+    render(ctx: CanvasRenderingContext2D, bounds?: IViewportBound): void;
     resize(width?: number | string, height?: number | string): this;
     scale(scaleX?: number, scaleY?: number): this;
     skew(skewX?: number, skewY?: number): this;

package/lib/types/layer.d.ts

@@ -18,11 +18,16 @@ import type { ThinScene } from './thin-scene';
 export declare class Layer {
     private _scene;
     private _zIndex;
+    private _allowCache;
     private _objects;
-    constructor(_scene: ThinScene, objects?: BaseObject[], _zIndex?: number);
+    private _cacheCanvas;
+    protected _dirty: boolean;
+    constructor(_scene: ThinScene, objects?: BaseObject[], _zIndex?: number, _allowCache?: boolean);
     get scene(): ThinScene;
     get zIndex(): number;
-    static create(scene: ThinScene, objects?: BaseObject[], zIndex?: number): Layer;
+    enableCache(): void;
+    disableCache(): void;
+    isAllowCache(): boolean;
     getObjectsByOrder(): BaseObject[];
     getObjectsByOrderForPick(): BaseObject[];
     getObjects(): BaseObject[];
@@ -30,6 +35,13 @@ export declare class Layer {
     removeObject(object: BaseObject | string): void;
     addObjects(objects: BaseObject[]): this;
     removeObjects(objects: BaseObject[] | string[]): void;
+    makeDirty(state?: boolean): this;
+    isDirty(): boolean;
+    render(parentCtx?: CanvasRenderingContext2D, isMaxLayer?: boolean): this;
+    private _initialCacheCanvas;
+    private _draw;
+    private _applyCache;
+    private _resizeCacheCanvas;
     clear(): void;
     dispose(): void;
 }

package/lib/types/scene-viewer.d.ts

@@ -17,7 +17,7 @@ import type { Nullable } from '@univerjs/core';
 import { BaseObject } from './base-object';
 import { RENDER_CLASS_TYPE } from './basics/const';
 import type { IObjectFullState } from './basics/interfaces';
-import type { IBoundRect, Vector2 } from './basics/vector2';
+import type { IViewportBound, Vector2 } from './basics/vector2';
 import type { ThinScene } from './thin-scene';
 export declare class SceneViewer extends BaseObject {
     private _subScenes;
@@ -25,7 +25,7 @@ export declare class SceneViewer extends BaseObject {
     private _allowSelectedClipElement;
     constructor(key?: string, props?: IObjectFullState);
     get classType(): RENDER_CLASS_TYPE;
-    render(mainCtx: CanvasRenderingContext2D, bounds?: IBoundRect): this;
+    render(mainCtx: CanvasRenderingContext2D, bounds?: IViewportBound): this;
     getSubScenes(): Map<string, ThinScene>;
     getActiveSubScene(): Nullable<ThinScene>;
     getSubScene(sceneKey: string): ThinScene | undefined;

package/lib/types/scene.d.ts

@@ -18,7 +18,6 @@ import type { BaseObject } from './base-object';
 import { CURSOR_TYPE } from './basics/const';
 import type { IKeyboardEvent, IMouseEvent, IPointerEvent, IWheelEvent } from './basics/i-events';
 import type { ISceneTransformState } from './basics/interfaces';
-import type { IBoundRect } from './basics/vector2';
 import { Vector2 } from './basics/vector2';
 import { Layer } from './layer';
 import type { ITransformerConfig } from './scene.-transformer';
@@ -31,8 +30,6 @@ export declare class Scene extends ThinScene {
     private _parent;
     private _layers;
     private _viewports;
-    private _isFirstDirty;
-    private _maxZIndex;
     private _cursor;
     private _defaultCursor;
     private _addObject$;
@@ -54,7 +51,10 @@ export declare class Scene extends ThinScene {
     detachControl(): this;
     makeDirty(state?: boolean): this;
     makeDirtyNoParent(state?: boolean): this;
+    enableLayerCache(...layerIndexes: number[]): void;
+    disableLayerCache(...layerIndexes: number[]): void;
     isDirty(): boolean;
+    getCursor(): CURSOR_TYPE;
     resetCursor(): void;
     setCursor(val: CURSOR_TYPE): void;
     setDefaultCursor(val: CURSOR_TYPE): void;
@@ -89,7 +89,6 @@ export declare class Scene extends ThinScene {
     getViewports(): Viewport[];
     getViewport(key: string): Viewport | undefined;
     changeObjectOrder(): void;
-    renderObjects(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): this;
     render(parentCtx?: CanvasRenderingContext2D): void;
     requestRender(parentCtx?: CanvasRenderingContext2D): Promise<unknown>;
     openTransformer(config?: ITransformerConfig): void;

package/lib/types/shape/rich-text.d.ts

@@ -15,7 +15,7 @@
  */
 import type { IDocumentData, IStyleBase, ITransformState, LocaleService } from '@univerjs/core';
 import { BaseObject } from '../base-object';
-import type { IBoundRect } from '../basics/vector2';
+import type { IViewportBound } from '../basics/vector2';
 export interface IRichTextProps extends ITransformState, IStyleBase {
     text?: string;
     richText?: IDocumentData;
@@ -27,8 +27,6 @@ export declare const RICHTEXT_OBJECT_ARRAY: string[];
 export declare class RichText extends BaseObject {
     private _localeService;
     private _documentData;
-    private _allowCache;
-    private _cacheCanvas;
     private _documentSkeleton;
     private _documents;
     private _ff?;
@@ -48,12 +46,11 @@ export declare class RichText extends BaseObject {
         height: number;
     } | undefined;
     setProps(props?: IRichTextProps): this | undefined;
-    render(mainCtx: CanvasRenderingContext2D, bounds?: IBoundRect): this;
+    render(mainCtx: CanvasRenderingContext2D, bounds?: IViewportBound): this;
     toJson(): {
         [x: string]: any;
     };
     protected _draw(ctx: CanvasRenderingContext2D): void;
     private _convertToDocumentData;
     private _initialProps;
-    private _applyCache;
 }

package/lib/types/shape/shape.d.ts

@@ -16,8 +16,7 @@
 import type { IScale, Nullable } from '@univerjs/core';
 import { BaseObject } from '../base-object';
 import type { IObjectFullState } from '../basics/interfaces';
-import type { IBoundRect, Vector2 } from '../basics/vector2';
-import { Canvas } from '../canvas';
+import type { IViewportBound, Vector2 } from '../basics/vector2';
 export type LineJoin = 'round' | 'bevel' | 'miter';
 export type LineCap = 'butt' | 'round' | 'square';
 export type PaintFirst = 'fill' | 'stroke';
@@ -28,7 +27,6 @@ export interface IShapeProps extends IObjectFullState {
     globalCompositeOperation?: string;
     evented?: boolean;
     visible?: boolean;
-    allowCache?: boolean;
     paintFirst?: PaintFirst;
     stroke?: Nullable<string | CanvasGradient>;
     strokeScaleEnabled?: boolean;
@@ -53,12 +51,10 @@ export interface IShapeProps extends IObjectFullState {
 }
 export declare const SHAPE_OBJECT_ARRAY: string[];
 export declare abstract class Shape<T> extends BaseObject {
-    protected _cacheCanvas: Nullable<Canvas>;
     private _hoverCursor;
     private _moveCursor;
     private _fillRule;
     private _globalCompositeOperation;
-    private _allowCache;
     private _paintFirst;
     private _stroke;
     private _strokeScaleEnabled;
@@ -84,7 +80,6 @@ export declare abstract class Shape<T> extends BaseObject {
     get moveCursor(): string | null;
     get fillRule(): string;
     get globalCompositeOperation(): string;
-    get allowCache(): boolean;
     get paintFirst(): PaintFirst;
     get stroke(): Nullable<string | CanvasGradient>;
     get strokeScaleEnabled(): boolean;
@@ -121,14 +116,11 @@ export declare abstract class Shape<T> extends BaseObject {
     private static __setFillStyles;
     private static __setStrokeStyles;
     private static __setLineDash;
-    render(mainCtx: CanvasRenderingContext2D, bounds?: IBoundRect): this;
+    render(mainCtx: CanvasRenderingContext2D, bounds?: IViewportBound): this;
     setProps(props?: T): this | undefined;
-    resizeCacheCanvas(): void;
-    scaleCacheCanvas(): void;
     toJson(): {
         [x: string]: any;
     };
-    protected _applyCache(ctx?: CanvasRenderingContext2D): void;
     protected _draw(ctx: CanvasRenderingContext2D): void;
     private _initialProps;
 }

package/lib/types/thin-scene.d.ts

@@ -21,7 +21,7 @@ import { RENDER_CLASS_TYPE } from './basics/const';
 import type { IKeyboardEvent, IMouseEvent, IPointerEvent, IWheelEvent } from './basics/i-events';
 import type { ITransformChangeState } from './basics/interfaces';
 import { Transform } from './basics/transform';
-import type { IBoundRect, Vector2 } from './basics/vector2';
+import type { IViewportBound, Vector2 } from './basics/vector2';
 export declare abstract class ThinScene {
     onTransformChangeObservable: Observable<ITransformChangeState>;
     onPointerDownObserver: Observable<IMouseEvent | IPointerEvent>;
@@ -73,7 +73,7 @@ export declare abstract class ThinScene {
     triggerPointerLeave(evt: IPointerEvent | IMouseEvent): void;
     triggerPointerOver(evt: IPointerEvent | IMouseEvent): void;
     triggerPointerEnter(evt: IPointerEvent | IMouseEvent): void;
-    renderObjects(ctx: CanvasRenderingContext2D, bounds?: IBoundRect): void;
+    renderObjects(ctx: CanvasRenderingContext2D, bounds?: IViewportBound): void;
     render(parentCtx?: CanvasRenderingContext2D): void;
     getParent(): any;
     dispose(): void;
@@ -84,6 +84,7 @@ export declare abstract class ThinScene {
     setObjectBehavior(o: BaseObject): void;
     applyTransformer(o: BaseObject): void;
     makeDirtyNoParent(state?: boolean): this;
+    makeDirty(state?: boolean): this;
     pick(coord: Vector2): Nullable<BaseObject | ThinScene>;
     getViewports(): any[];
     removeViewport(key: string): void;

package/lib/types/viewport.d.ts

@@ -15,9 +15,10 @@
  */
 import type { EventState, IPosition, Nullable } from '@univerjs/core';
 import { Observable } from '@univerjs/core';
+import type { BaseObject } from './base-object';
 import type { IWheelEvent } from './basics/i-events';
 import { Transform } from './basics/transform';
-import type { IBoundRect } from './basics/vector2';
+import type { IViewportBound } from './basics/vector2';
 import { Vector2 } from './basics/vector2';
 import type { BaseScrollBar } from './shape/base-scroll-bar';
 import type { ThinScene } from './thin-scene';
@@ -70,6 +71,7 @@ export declare class Viewport {
     onScrollAfterObserver: Observable<IScrollObserverParam>;
     onScrollBeforeObserver: Observable<IScrollObserverParam>;
     onScrollStopObserver: Observable<IScrollObserverParam>;
+    onScrollByBarObserver: Observable<IScrollObserverParam>;
     private _viewPortKey;
     private _dirty;
     private _topOrigin;
@@ -85,11 +87,9 @@ export declare class Viewport {
     private _width;
     private _height;
     private _scene;
-    private _cacheCanvas;
     private _scrollBar?;
     private _isWheelPreventDefaultX;
     private _isWheelPreventDefaultY;
-    private _allowCache;
     private _scrollStopNum;
     private _preScrollX;
     private _preScrollY;
@@ -101,6 +101,7 @@ export declare class Viewport {
     private _paddingEndY;
     private _isRelativeX;
     private _isRelativeY;
+    private _preViewportBound;
     constructor(viewPortKey: string, scene: ThinScene, props?: IViewProps);
     get scene(): ThinScene;
     get width(): Nullable<number>;
@@ -151,6 +152,7 @@ export declare class Viewport {
         isLimitedX: boolean;
         isLimitedY: boolean;
     } | undefined;
+    scrollByBar(pos: IScrollBarPosition, isTrigger?: boolean): void;
     /**
      * current position plus offset relatively
      * the caller no need to deal with the padding when frozen
@@ -177,14 +179,14 @@ export declare class Viewport {
     };
     getScrollBar(): Nullable<BaseScrollBar>;
     updateScroll(param: IScrollObserverParam): this;
-    getScrollBarTransForm(isMouseFix?: boolean): Transform;
-    render(parentCtx?: CanvasRenderingContext2D): void;
-    getBounding(): IBoundRect;
+    getScrollBarTransForm(): Transform;
+    render(parentCtx?: CanvasRenderingContext2D, objects?: BaseObject[], isMaxLayer?: boolean): void;
+    getBounding(): IViewportBound;
     getRelativeVector(coord: Vector2): Vector2;
     getAbsoluteVector(coord: Vector2): Vector2;
     onMouseWheel(evt: IWheelEvent, state: EventState): void;
     isHit(coord: Vector2): boolean | undefined;
-    pickScrollBar(coord: Vector2): import("@univerjs/engine-render").Rect<import("@univerjs/engine-render").IRectProps> | null | undefined;
+    pickScrollBar(coord: Vector2): import("./shape").Rect<import("./shape").IRectProps> | null | undefined;
     openClip(): void;
     closeClip(): void;
     dispose(): void;
@@ -194,13 +196,12 @@ export declare class Viewport {
     } | undefined;
     private _resizeCacheCanvasAndScrollBar;
     private _getViewPortSize;
-    private _getApplyCanvasState;
     private _scrollRendered;
     private _triggerScrollStop;
     private _scroll;
     private _calViewportRelativeBounding;
-    private drawScrollbar;
-    private _applyCache;
+    private _diffViewBound;
+    private _drawScrollbar;
     private _setWithAndHeight;
     private _getBoundScale;
 }