diff --git a/packages/dockview-core/src/__tests__/dockview/components/panel/content.spec.ts b/packages/dockview-core/src/__tests__/dockview/components/panel/content.spec.ts
index ecb7cb948..48f59dc64 100644
--- a/packages/dockview-core/src/__tests__/dockview/components/panel/content.spec.ts
+++ b/packages/dockview-core/src/__tests__/dockview/components/panel/content.spec.ts
@@ -60,7 +60,7 @@ describe('contentContainer', () => {
 
         const dockviewComponent = jest.fn<DockviewComponent, []>(() => {
             return {
-              renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as DockviewComponent;
         });
 
@@ -81,7 +81,7 @@ describe('contentContainer', () => {
             view: {
                 content: contentRenderer,
             } as Partial<IDockviewPanelModel>,
-            api: { renderer: 'destructive' },
+            api: { renderer: 'onlyWhenVisibile' },
         } as Partial<IDockviewPanel>;
 
         cut.openPanel(panel as IDockviewPanel);
@@ -116,7 +116,7 @@ describe('contentContainer', () => {
             view: {
                 content: contentRenderer2,
             } as Partial<IDockviewPanelModel>,
-            api: { renderer: 'destructive' },
+            api: { renderer: 'onlyWhenVisibile' },
         } as Partial<IDockviewPanel>;
 
         cut.openPanel(panel2 as IDockviewPanel);
diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts
index 8b574ce6d..9705a69b9 100644
--- a/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts
+++ b/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts
@@ -258,13 +258,13 @@ describe('groupview', () => {
 
     test('panel events are captured during de-serialization', () => {
         const panel1 = new TestPanel('panel1', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel2 = new TestPanel('panel2', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel3 = new TestPanel('panel3', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
 
         const groupview2 = new DockviewGroupPanel(dockview, 'groupview-2', {
@@ -350,13 +350,13 @@ describe('groupview', () => {
         );
 
         const panel1 = new TestPanel('panel1', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel2 = new TestPanel('panel2', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel3 = new TestPanel('panel3', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
 
         expect(events.length).toBe(0);
@@ -436,13 +436,13 @@ describe('groupview', () => {
 
     test('moveToPrevious and moveToNext', () => {
         const panel1 = new TestPanel('panel1', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel2 = new TestPanel('panel2', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel3 = new TestPanel('panel3', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
 
         groupview.model.openPanel(panel1);
@@ -488,13 +488,13 @@ describe('groupview', () => {
 
     test('closeAllPanels with panels', () => {
         const panel1 = new TestPanel('panel1', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel2 = new TestPanel('panel2', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
         const panel3 = new TestPanel('panel3', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
 
         groupview.model.openPanel(panel1);
@@ -601,7 +601,7 @@ describe('groupview', () => {
             .item(0)!.childNodes;
 
         const panel1 = new TestPanel('id_1', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
 
         cut.openPanel(panel1);
@@ -609,7 +609,7 @@ describe('groupview', () => {
         expect(contentContainer.item(0)).toBe(panel1.view.content.element);
 
         const panel2 = new TestPanel('id_2', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
 
         cut.openPanel(panel2);
@@ -617,7 +617,7 @@ describe('groupview', () => {
         expect(contentContainer.item(0)).toBe(panel2.view.content.element);
 
         const panel3 = new TestPanel('id_2', {
-            renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         } as any);
 
         cut.openPanel(panel3, { skipSetPanelActive: true });
@@ -822,7 +822,7 @@ describe('groupview', () => {
 
         cut.openPanel(
             new TestPanel('panel1', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
 
@@ -892,12 +892,12 @@ describe('groupview', () => {
 
         cut.openPanel(
             new TestPanel('panel1', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
         cut.openPanel(
             new TestPanel('panel2', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
 
@@ -967,12 +967,12 @@ describe('groupview', () => {
 
         cut.openPanel(
             new TestPanel('panel1', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
         cut.openPanel(
             new TestPanel('panel2', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
 
@@ -1077,7 +1077,7 @@ describe('groupview', () => {
 
         cut.openPanel(
             new TestPanel('panel1', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
 
@@ -1091,7 +1091,7 @@ describe('groupview', () => {
 
         cut.openPanel(
             new TestPanel('panel2', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
 
@@ -1113,7 +1113,7 @@ describe('groupview', () => {
 
         cut.openPanel(
             new TestPanel('panel1', {
-                renderer: 'destructive',
+                renderer: 'onlyWhenVisibile',
             } as any)
         );
 
diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts
index 352804f56..a7381e191 100644
--- a/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts
+++ b/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts
@@ -30,7 +30,7 @@ describe('dockviewPanel', () => {
         const model = <IDockviewPanelModel>new panelModelMock();
 
         const cut = new DockviewPanel('fake-id', accessor, api, group, model, {
-          renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         });
 
         let latestTitle: string | undefined = undefined;
@@ -77,7 +77,7 @@ describe('dockviewPanel', () => {
         const model = <IDockviewPanelModel>new panelModelMock();
 
         const cut = new DockviewPanel('fake-id', accessor, api, group, model, {
-          renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         });
 
         cut.init({ title: 'myTitle', params: {} });
@@ -114,7 +114,7 @@ describe('dockviewPanel', () => {
         const model = <IDockviewPanelModel>new panelModelMock();
 
         const cut = new DockviewPanel('fake-id', accessor, api, group, model, {
-          renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         });
 
         cut.init({ params: {}, title: 'title' });
@@ -148,7 +148,7 @@ describe('dockviewPanel', () => {
         const model = <IDockviewPanelModel>new panelModelMock();
 
         const cut = new DockviewPanel('fake-id', accessor, api, group, model, {
-          renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         });
 
         expect(cut.params).toEqual(undefined);
@@ -186,7 +186,7 @@ describe('dockviewPanel', () => {
         const model = <IDockviewPanelModel>new panelModelMock();
 
         const cut = new DockviewPanel('fake-id', accessor, api, group, model, {
-          renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         });
 
         cut.api.setSize({ height: 123, width: 456 });
@@ -219,7 +219,7 @@ describe('dockviewPanel', () => {
         const model = <IDockviewPanelModel>new panelModelMock();
 
         const cut = new DockviewPanel('fake-id', accessor, api, group, model, {
-          renderer: 'destructive',
+            renderer: 'onlyWhenVisibile',
         });
 
         cut.init({ params: { a: '1', b: '2' }, title: 'A title' });
diff --git a/packages/dockview-core/src/dockview/components/greadyRenderContainer.ts b/packages/dockview-core/src/dockview/components/greadyRenderContainer.ts
index ae0225ad2..e4c02cb9a 100644
--- a/packages/dockview-core/src/dockview/components/greadyRenderContainer.ts
+++ b/packages/dockview-core/src/dockview/components/greadyRenderContainer.ts
@@ -4,7 +4,7 @@ import { getDomNodePagePosition, toggleClass } from '../../dom';
 import { CompositeDisposable, Disposable, IDisposable } from '../../lifecycle';
 import { IDockviewPanel } from '../dockviewPanel';
 
-export type DockviewPanelRenderer = 'destructive' | 'gready';
+export type DockviewPanelRenderer = 'onlyWhenVisibile' | 'always';
 
 export interface IRenderable {
     readonly element: HTMLElement;
diff --git a/packages/dockview-core/src/dockview/components/panel/content.ts b/packages/dockview-core/src/dockview/components/panel/content.ts
index bed3e1d41..3a0dc707f 100644
--- a/packages/dockview-core/src/dockview/components/panel/content.ts
+++ b/packages/dockview-core/src/dockview/components/panel/content.ts
@@ -128,7 +128,7 @@ export class ContentContainer
         let container: HTMLElement;
 
         switch (panel.api.renderer) {
-            case 'destructive':
+            case 'onlyWhenVisibile':
                 this.accessor.greadyRenderContainer.remove(panel);
                 if (isActive) {
                     if (this.panel) {
@@ -139,7 +139,7 @@ export class ContentContainer
                 }
                 container = this._element;
                 break;
-            case 'gready':
+            case 'always':
                 if (
                     panel.view.content.element.parentElement === this._element
                 ) {
@@ -203,14 +203,14 @@ export class ContentContainer
         let container: HTMLElement;
 
         switch (renderer) {
-            case 'gready':
+            case 'always':
                 container =
                     this.accessor.greadyRenderContainer.setReferenceContentContainer(
                         panel,
                         this
                     );
                 break;
-            case 'destructive':
+            case 'onlyWhenVisibile':
                 this._element.appendChild(this.panel.view.content.element);
                 container = this._element;
                 break;
@@ -246,7 +246,7 @@ export class ContentContainer
 
     public closePanel(): void {
         if (this.panel) {
-            if (this.accessor.options.defaultRenderer === 'destructive') {
+            if (this.accessor.options.defaultRenderer === 'onlyWhenVisibile') {
                 this._element.removeChild(this.panel.view.content.element);
             }
             this.panel = undefined;
diff --git a/packages/dockview-core/src/dockview/dockviewComponent.ts b/packages/dockview-core/src/dockview/dockviewComponent.ts
index 2ee5f7208..d9db6d830 100644
--- a/packages/dockview-core/src/dockview/dockviewComponent.ts
+++ b/packages/dockview-core/src/dockview/dockviewComponent.ts
@@ -351,7 +351,7 @@ export class DockviewComponent
     }
 
     get renderer(): DockviewPanelRenderer {
-        return this.options.defaultRenderer ?? 'destructive';
+        return this.options.defaultRenderer ?? 'onlyWhenVisibile';
     }
 
     constructor(options: DockviewComponentOptions) {
diff --git a/packages/docs/sandboxes/demo-dockview/src/app.tsx b/packages/docs/sandboxes/demo-dockview/src/app.tsx
index 4e387fa06..e420a0ddc 100644
--- a/packages/docs/sandboxes/demo-dockview/src/app.tsx
+++ b/packages/docs/sandboxes/demo-dockview/src/app.tsx
@@ -58,9 +58,9 @@ const components = {
                         <button
                             onClick={() => {
                                 setMode(
-                                    mode === 'destructive'
-                                        ? 'gready'
-                                        : 'destructive'
+                                    mode === 'onlyWhenVisibile'
+                                        ? 'always'
+                                        : 'onlyWhenVisibile'
                                 );
                             }}
                         >
diff --git a/packages/docs/sandboxes/rendermode-dockview/src/app.tsx b/packages/docs/sandboxes/rendermode-dockview/src/app.tsx
index 941a135ea..e2809f250 100644
--- a/packages/docs/sandboxes/rendermode-dockview/src/app.tsx
+++ b/packages/docs/sandboxes/rendermode-dockview/src/app.tsx
@@ -55,9 +55,9 @@ const components = {
                         <button
                             onClick={() => {
                                 setMode(
-                                    mode === 'destructive'
-                                        ? 'gready'
-                                        : 'destructive'
+                                    mode === 'onlyWhenVisibile'
+                                        ? 'always'
+                                        : 'onlyWhenVisibile'
                                 );
                             }}
                         >