neo.mjs 10.0.0-alpha.4 → 10.0.0-alpha.5

package/ServiceWorker.mjs

@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
          */
         singleton: true,
         /**
-         * @member {String} version='10.0.0-alpha.4'
+         * @member {String} version='10.0.0-alpha.5'
          */
-        version: '10.0.0-alpha.4'
+        version: '10.0.0-alpha.5'
     }
 
     /**

package/apps/portal/index.html

@@ -16,7 +16,7 @@
         "@type": "Organization",
         "name": "Neo.mjs"
       },
-      "datePublished": "2025-06-22",
+      "datePublished": "2025-06-24",
       "publisher": {
         "@type": "Organization",
         "name": "Neo.mjs"

package/apps/portal/view/blog/List.mjs

@@ -174,7 +174,7 @@ class List extends BaseList {
             record   = store.getAt(index);
             name     = record.name.replace(List.nameRegEx, "$1");
 
-            item.style = item.style || {};
+            item.style ??= {};
 
             if (emptyValue) {
                 itemName.html = name;

package/apps/portal/view/home/FooterContainer.mjs

@@ -107,7 +107,7 @@ class FooterContainer extends Container {
             }, {
                 module: Component,
                 cls   : ['neo-version'],
-                html  : 'v10.0.0-alpha.4'
+                html  : 'v10.0.0-alpha.5'
             }]
         }],
         /**

package/buildScripts/buildThemes.mjs

@@ -12,7 +12,7 @@ import * as sass    from 'sass';
 const
     __dirname    = path.resolve(),
     cwd          = process.cwd(),
-    requireJson  = path => JSON.parse(fs.readFileSync((path))),
+    requireJson  = path => JSON.parse(fs.readFileSync(path)),
     packageJson  = requireJson(path.resolve(cwd, 'package.json')),
     insideNeo    = packageJson.name.includes('neo.mjs'),
     neoPath      = path.resolve(insideNeo ? './' : './node_modules/neo.mjs/'),

package/examples/grid/animatedRowSorting/Viewport.mjs

@@ -52,12 +52,12 @@ class Viewport extends BaseViewport {
             store       : MainStore,
             wrapperStyle: {maxWidth: '902px'},
 
-            columnDefaults: {
-                width: 200
+            bodyConfig: {
+                animatedRowSorting: true
             },
 
-            viewConfig: {
-                animatedRowSorting: true
+            columnDefaults: {
+                width: 200
             },
 
             columns: [

package/examples/grid/bigData/ControlsContainer.mjs

@@ -207,7 +207,7 @@ class ControlsContainer extends Container {
      */
     onBufferColumnRangeChange(data) {
         if (data.oldValue) {
-            this.grid.view.bufferColumnRange = parseInt(data.value.id)
+            this.grid.body.bufferColumnRange = parseInt(data.value.id)
         }
     }
 
@@ -216,7 +216,7 @@ class ControlsContainer extends Container {
      */
     onBufferRowRangeChange(data) {
         if (data.oldValue) {
-            this.grid.view.bufferRowRange = parseInt(data.value.id)
+            this.grid.body.bufferRowRange = parseInt(data.value.id)
         }
     }
 
@@ -263,7 +263,7 @@ class ControlsContainer extends Container {
      * @param {Object} data
      */
     onSelectionModelChange(data) {
-        this.grid.view.selectionModel = data.component.selectionModel
+        this.grid.body.selectionModel = data.component.selectionModel
     }
 
     /**

package/examples/grid/bigData/GridContainer.mjs

@@ -17,6 +17,13 @@ class GridContainer extends BaseGridContainer {
          * @member {Number} amountColumns_=50
          */
         amountColumns_: 50,
+        /**
+         * @member {Object} bodyConfig
+         */
+        bodyConfig: {
+            bufferColumnRange: 3,
+            bufferRowRange   : 5
+        },
         /**
          * Default configs for each column
          * @member {Object} columnDefaults
@@ -29,14 +36,7 @@ class GridContainer extends BaseGridContainer {
         /**
          * @member {Object[]} store=MainStore
          */
-        store: MainStore,
-        /**
-         * @member {Object} viewConfig
-         */
-        viewConfig: {
-            bufferColumnRange: 3,
-            bufferRowRange   : 5
-        }
+        store: MainStore
     }
 
     /**

package/examples/grid/cellEditing/MainContainer.mjs

@@ -114,6 +114,10 @@ class MainContainer extends ConfigurationViewport {
             store       : MainStore,
             wrapperStyle: {maxWidth: '1002px'},
 
+            bodyConfig: {
+                selectionModel: CellModel
+            },
+
             columnDefaults: {
                 editable: true,
                 width   : 200
@@ -160,11 +164,7 @@ class MainContainer extends ConfigurationViewport {
                 dataField: 'githubId',
                 editable : false,
                 text     : 'Github Id (Non-editable)'
-            }],
-
-            viewConfig: {
-                selectionModel: CellModel
-            }
+            }]
         }
     }
 

package/examples/grid/container/MainContainer.mjs

@@ -88,6 +88,10 @@ class MainContainer extends ConfigurationViewport {
                 width: 200
             },
 
+            bodyConfig: {
+                selectionModel: CellModel
+            },
+
             columns: [
                 {dataField: 'firstname', text: 'Firstname'},
                 {dataField: 'lastname',  text: 'Lastname'},
@@ -95,10 +99,6 @@ class MainContainer extends ConfigurationViewport {
                 {dataField: 'country',   text: 'Country'}
             ],
 
-            viewConfig: {
-                selectionModel: CellModel
-            },
-
             wrapperStyle: {
                 height: '250px'
             }

package/examples/grid/nestedRecordFields/Viewport.mjs

@@ -51,6 +51,10 @@ class Viewport extends BaseViewport {
             bind     : {store: 'stores.mainStore'},
             reference: 'grid',
 
+            bodyConfig: {
+                highlightModifiedCells: true
+            },
+
             columnDefaults: {
                 width: 200
             },
@@ -66,11 +70,7 @@ class Viewport extends BaseViewport {
                     handler: 'editButtonHandler',
                     text   : 'Edit'
                 }}
-            ],
-
-            viewConfig: {
-                highlightModifiedCells: true
-            }
+            ]
         }]
     }
 }

package/learn/guides/ApplicationBootstrap.md

@@ -14,6 +14,15 @@ using Web Workers.
 
 ## Bootstrap Sequence
 
+```
+myapp/
+├── view/
+│   └── Viewport.mjs // The app main view
+├── app.mjs           // The entry-point for your code inside the app worker
+├── index.html        // The entry-point for a main-thread
+└── neo-config.json   // Framework global configs for your app
+```
+
 ### 1. Entry Point: index.html
 
 The bootstrap process begins with a minimal HTML file:
@@ -66,7 +75,7 @@ of all available configuration options, you can refer to the `src/DefaultConfig.
     "basePath"        : "../../",
     "environment"     : "development",
     "mainPath"        : "./Main.mjs",
-    "mainThreadAddons": ["Stylesheet"],
+    "mainThreadAddons": ["DragDrop", "Navigator", "Stylesheet"],
     "themes"          : ["neo-theme-light"],
     "useCanvasWorker" : false,
     "useDataWorker"   : false,
@@ -149,12 +158,10 @@ The Main class:
 3. Listens for the 'domContentLoaded' event
 4. When the DOM is loaded, it loads any main thread addons and notifies the WorkerManager
 
-### 5. Worker Manager: Creating Workers
-
-The `WorkerManager` is responsible for creating and managing the workers:
+### 5. Neo.worker.Manager: Creating Workers
 
 ```javascript
-class Manager extends Base {
+class Manager extends core.Base {
     // ...
 
     createWorkers() {
@@ -198,24 +205,20 @@ class Manager extends Base {
         if (me.constructedThreads === me.activeWorkers) {
             // All workers are constructed, load the application
             NeoConfig.appPath && me.timeout(NeoConfig.loadApplicationDelay).then(() => {
-                me.loadApplication(NeoConfig.appPath)
+                me.loadApplication()
             })
         }
     }
 
-    loadApplication(path) {
-        this.sendMessage('app', {
-            action       : 'loadApplication',
-            path,
-            resourcesPath: NeoConfig.resourcesPath
-        })
+    loadApplication() {
+        this.sendMessage('app', {action: 'loadApplication' })
     }
 
     // ...
 }
 ```
 
-The WorkerManager:
+`Neo.worker.Manager`:
 1. Detects browser features (Web Workers, SharedWorkers)
 2. Creates workers for App, VDom, Data, etc. based on configuration
 3. Sends the Neo.config to each worker
@@ -262,12 +265,7 @@ class App extends Base {
             path = path.slice(0, -4)
         }
 
-        return import(
-            /* webpackInclude: /(?:\/|\\)app.mjs$/ */
-            /* webpackExclude: /(?:\/|\\)(dist|node_modules)/ */
-            /* webpackMode: "lazy" */
-            `../../${path}.mjs`
-        )
+        return import(`../../${path}.mjs`)
     }
 
     // ...
@@ -285,7 +283,7 @@ The App worker:
 Finally, the application's `app.mjs` file is loaded and executed:
 
 ```javascript
-import Overwrites from './Overwrites.mjs'; // Optional framework extensions
+import Overwrites from './Overwrites.mjs';    // Optional class config default value changes for framework classes
 import Viewport   from './view/Viewport.mjs'; // Your main UI component
 
 export const onStart = () => Neo.app({

package/package.json

@@ -1,6 +1,6 @@
 {
     "name"           : "neo.mjs",
-    "version"        : "10.0.0-alpha.4",
+    "version"        : "10.0.0-alpha.5",
     "description"    : "Neo.mjs: The multi-threaded UI framework for building ultra-fast, desktop-like web applications with uncompromised responsiveness, inherent security, and a transpilation-free dev mode.",
     "type"           : "module",
     "repository"     : {

package/resources/scss/src/grid/{View.scss → Body.scss}

@@ -1,4 +1,4 @@
-.neo-grid-view-wrapper {
+.neo-grid-body-wrapper {
     height         : 100%;
     overflow-anchor: none;
     overflow-x     : hidden;
@@ -11,7 +11,7 @@
     }
 }
 
-.neo-grid-view {
+.neo-grid-body {
     height    : 100%;
     overflow-x: visible;
 

package/resources/scss/src/grid/VerticalScrollbar.scss

@@ -14,7 +14,7 @@
     }
 }
 
-.neo-grid-wrapper:has(.neo-grid-view.neo-is-scrolling) {
+.neo-grid-wrapper:has(.neo-grid-body.neo-is-scrolling) {
     .neo-grid-vertical-scrollbar {
         opacity: 1;
     }

package/resources/scss/src/grid/plugin/AnimateRows.scss

@@ -1,4 +1,4 @@
-.neo-grid-view {
+.neo-grid-body {
     &.neo-animate-rows {
         .neo-grid-row {
             transition:

package/resources/scss/src/grid/plugin/CellEditing.scss

@@ -1,4 +1,4 @@
-.neo-grid-view {
+.neo-grid-body {
     .neo-grid-cell {
         &:has(.neo-grid-editor) {
             padding: 1px 4px 2px;

package/resources/scss/theme-dark/grid/{View.scss → Body.scss}

@@ -1,4 +1,4 @@
-:root .neo-theme-dark { // .neo-grid-view
+:root .neo-theme-dark { // .neo-grid-body
     --grid-cell-background-color-hover                    : #54595c;
     --grid-cell-ismodified-color                          : orange;
     --grid-cell-ismodified-size                           : 10px;

package/resources/scss/theme-light/grid/{View.scss → Body.scss}

@@ -1,6 +1,6 @@
 @use "sass:color";
 
-:root .neo-theme-light { // .neo-grid-view
+:root .neo-theme-light { // .neo-grid-body
     --grid-cell-background-color-hover                    : #{color.adjust(#33343d, $lightness: 70%)};
     --grid-cell-ismodified-color                          : orange;
     --grid-cell-ismodified-size                           : 10px;

package/resources/scss/theme-neo-light/grid/{View.scss → Body.scss}

@@ -1,6 +1,6 @@
 @use "sass:color";
 
-:root .neo-theme-neo-light { // .neo-grid-view
+:root .neo-theme-neo-light { // .neo-grid-body
     --grid-cell-background-color-hover                    : #{color.adjust(#33343d, $lightness: 70%)};
     --grid-cell-ismodified-color                          : orange;
     --grid-cell-ismodified-size                           : 10px;

package/src/DefaultConfig.mjs

@@ -289,12 +289,12 @@ const DefaultConfig = {
     useVdomWorker: true,
     /**
      * buildScripts/injectPackageVersion.mjs will update this value
-     * @default '10.0.0-alpha.4'
+     * @default '10.0.0-alpha.5'
      * @memberOf! module:Neo
      * @name config.version
      * @type String
      */
-    version: '10.0.0-alpha.4'
+    version: '10.0.0-alpha.5'
 };
 
 Object.assign(DefaultConfig, {

package/src/grid/{View.mjs → Body.mjs}

@@ -6,21 +6,21 @@ import RowModel        from '../selection/grid/RowModel.mjs';
 import VDomUtil        from '../util/VDom.mjs';
 
 /**
- * @class Neo.grid.View
+ * @class Neo.grid.Body
  * @extends Neo.component.Base
  */
-class GridView extends Component {
+class GridBody extends Component {
     static config = {
         /**
-         * @member {String} className='Neo.grid.View'
+         * @member {String} className='Neo.grid.Body'
          * @protected
          */
-        className: 'Neo.grid.View',
+        className: 'Neo.grid.Body',
         /**
-         * @member {String} ntype='grid-view'
+         * @member {String} ntype='grid-body'
          * @protected
          */
-        ntype: 'grid-view',
+        ntype: 'grid-body',
         /**
          * @member {Boolean} animatedRowSorting_=false
          */
@@ -36,23 +36,23 @@ class GridView extends Component {
          */
         availableRows_: 0,
         /**
-         * Internal flag. Gets calculated after mounting grid.View rows
+         * Internal flag. Gets calculated after mounting grid.Body rows
          * @member {Number} availableWidth_=0
          */
         availableWidth_: 0,
         /**
-         * @member {String[]} baseCls=['neo-grid-view']
+         * @member {String[]} baseCls=['neo-grid-body']
          * @protected
          */
-        baseCls: ['neo-grid-view'],
+        baseCls: ['neo-grid-body'],
         /**
-         * The amount of columns (cells) to paint before the first & after the last visible column,
+         * The number of columns (cells) to paint before the first and after the last visible column,
          * to enhance the scrolling performance
          * @member {Number} bufferColumnRange_=0
          */
         bufferColumnRange_: 0,
         /**
-         * The amount of rows to paint before the first & after the last visible row,
+         * The number of rows to paint before the first and after the last visible row,
          * to enhance the scrolling performance
          * @member {Number} bufferRowRange_=3
          */
@@ -63,7 +63,7 @@ class GridView extends Component {
          */
         colspanField: 'colspan',
         /**
-         * Internal flag. Gets calculated after mounting grid.View rows
+         * Internal flag. Gets calculated after mounting grid.Body rows
          * @member {Number} containerWidth_=0
          */
         containerWidth_: 0,
@@ -150,9 +150,9 @@ class GridView extends Component {
          */
         visibleRows: [0, 0],
         /**
-         * @member {String[]} wrapperCls=[]
+         * @member {String[]} wrapperCls=['neo-grid-body-wrapper']
          */
-        wrapperCls: ['neo-grid-view-wrapper'],
+        wrapperCls: ['neo-grid-body-wrapper'],
         /**
          * @member {Object} _vdom
          */
@@ -686,7 +686,7 @@ class GridView extends Component {
             dataField = me.getCellDataField(id),
             record    = me.getRecord(id);
 
-        me.parent.fire(eventName, {data, dataField, record, view: me})
+        me.parent.fire(eventName, {body: me, data, dataField, record})
     }
 
     /**
@@ -698,7 +698,7 @@ class GridView extends Component {
             id     = data.currentTarget,
             record = me.getRecord(id);
 
-        me.parent.fire(eventName, {data, record, view: me})
+        me.parent.fire(eventName, {body: me, data, record})
     }
 
     /**
@@ -1133,4 +1133,4 @@ class GridView extends Component {
     }
 }
 
-export default Neo.setupClass(GridView);
+export default Neo.setupClass(GridBody);

package/src/grid/Container.mjs

@@ -1,7 +1,7 @@
 import BaseContainer     from '../container/Base.mjs';
 import ClassSystemUtil   from '../util/ClassSystem.mjs';
 import Collection        from '../collection/Base.mjs';
-import GridView          from './View.mjs';
+import GridBody          from './Body.mjs';
 import ScrollManager     from './ScrollManager.mjs';
 import Store             from '../data/Store.mjs';
 import VerticalScrollbar from './VerticalScrollbar.mjs';
@@ -52,6 +52,16 @@ class GridContainer extends BaseContainer {
          * @protected
          */
         baseCls: ['neo-grid-container'],
+        /**
+         * Configs for Neo.grid.Body
+         * @member {Object|null} [bodyConfig=null]
+         */
+        bodyConfig: null,
+        /**
+         * @member {String|null} bodyId_=null
+         * @protected
+         */
+        bodyId_: null,
         /**
          * true uses grid.plugin.CellEditing
          * @member {Boolean} cellEditing_=false
@@ -105,16 +115,6 @@ class GridContainer extends BaseContainer {
          * @member {Neo.data.Store} store_=null
          */
         store_: null,
-        /**
-         * Configs for Neo.grid.View
-         * @member {Object|null} [viewConfig=null]
-         */
-        viewConfig: null,
-        /**
-         * @member {String|null} viewId_=null
-         * @protected
-         */
-        viewId_: null,
         /**
          * @member {Array|null} items=null
          * @protected
@@ -142,19 +142,19 @@ class GridContainer extends BaseContainer {
     scrollManager = null
 
     /**
-     * Convenience method to access the Neo.grid.header.Toolbar
-     * @returns {Neo.grid.header.Toolbar|null}
+     * Convenience method to access the Neo.grid.Body
+     * @returns {Neo.grid.Body|null}
      */
-    get headerToolbar() {
-        return Neo.getComponent(this.headerToolbarId) || Neo.get(this.headerToolbarId)
+    get body() {
+        return Neo.getComponent(this.bodyId) || Neo.get(this.bodyId)
     }
 
     /**
-     * Convenience method to access the Neo.grid.View
-     * @returns {Neo.grid.View|null}
+     * Convenience method to access the Neo.grid.header.Toolbar
+     * @returns {Neo.grid.header.Toolbar|null}
      */
-    get view() {
-        return Neo.getComponent(this.viewId) || Neo.get(this.viewId)
+    get headerToolbar() {
+        return Neo.getComponent(this.headerToolbarId) || Neo.get(this.headerToolbarId)
     }
 
     /**
@@ -166,8 +166,8 @@ class GridContainer extends BaseContainer {
         let me = this,
             {appName, rowHeight, store, windowId} = me;
 
+        me.bodyId          = Neo.getId('grid-body');
         me.headerToolbarId = Neo.getId('grid-header-toolbar');
-        me.viewId          = Neo.getId('grid-view');
 
         me.items = [{
             module           : header.Toolbar,
@@ -176,13 +176,13 @@ class GridContainer extends BaseContainer {
             sortable         : me.sortable,
             ...me.headerToolbarConfig
         }, {
-            module       : GridView,
+            module       : GridBody,
             flex         : 1,
             gridContainer: me,
-            id           : me.viewId,
+            id           : me.bodyId,
             rowHeight,
             store,
-            ...me.viewConfig
+            ...me.bodyConfig
         }];
 
         me.scrollbar = Neo.create({
@@ -218,7 +218,7 @@ class GridContainer extends BaseContainer {
 
         if (mounted) {
             ResizeObserver.register(resizeParams);
-            await me.passSizeToView()
+            await me.passSizeToBody()
         } else {
             me.initialResizeEvent = true;
             ResizeObserver.unregister(resizeParams)
@@ -262,9 +262,9 @@ class GridContainer extends BaseContainer {
 
             await me.timeout(50);
 
-            await me.passSizeToView();
+            await me.passSizeToBody();
 
-            me.view?.createViewData()
+            me.body?.createViewData()
         }
     }
 
@@ -287,14 +287,14 @@ class GridContainer extends BaseContainer {
      */
     afterSetRowHeight(value, oldValue) {
         if (value > 0) {
-            let {scrollbar, view} = this;
+            let {body, scrollbar} = this;
 
             if (scrollbar) {
                 scrollbar.rowHeight = value
             }
 
-            if (view) {
-                view.rowHeight = value
+            if (body) {
+                body.rowHeight = value
             }
         }
     }
@@ -340,12 +340,22 @@ class GridContainer extends BaseContainer {
         value   ?.on(listeners);
         oldValue?.un(listeners);
 
-        // in case we dynamically change the store, the view needs to get the new reference
-        if (me.view) {
-            me.view.store = value
+        // in case we dynamically change the store, grid.Body needs to get the new reference
+        if (me.body) {
+            me.body.store = value
         }
     }
 
+    /**
+     * Triggered before the bodyId config gets changed.
+     * @param {String} value
+     * @param {String} oldValue
+     * @protected
+     */
+    beforeSetBodyId(value, oldValue) {
+        return value || oldValue
+    }
+
     /**
      * Triggered before the columns config gets changed.
      * @param {Object[]} value
@@ -384,16 +394,6 @@ class GridContainer extends BaseContainer {
         return value
     }
 
-    /**
-     * Triggered before the viewId config gets changed.
-     * @param {String} value
-     * @param {String} oldValue
-     * @protected
-     */
-    beforeSetViewId(value, oldValue) {
-        return value || oldValue
-    }
-
     /**
      * In case you want to update multiple existing records in parallel,
      * using this method is faster than updating each record one by one.
@@ -401,19 +401,19 @@ class GridContainer extends BaseContainer {
      * @param {Object[]} records
      */
     bulkUpdateRecords(records) {
-        let {store, view} = this,
+        let {body, store} = this,
             {keyProperty} = store;
 
-        if (view) {
-            view.silentVdomUpdate = true;
+        if (body) {
+            body.silentVdomUpdate = true;
 
             records.forEach(item => {
                 store.get(item[keyProperty])?.set(item)
             });
 
-            view.silentVdomUpdate = false;
+            body.silentVdomUpdate = false;
 
-            view.update()
+            body.update()
         }
     }
 
@@ -527,9 +527,9 @@ class GridContainer extends BaseContainer {
         let me = this;
 
         me.scrollManager = Neo.create({
+            gridBody     : me.body,
             module       : ScrollManager,
-            gridContainer: me,
-            gridView     : me.view
+            gridContainer: me
         })
     }
 
@@ -540,11 +540,11 @@ class GridContainer extends BaseContainer {
         let me = this;
 
         if (!me.initialResizeEvent) {
-            await me.passSizeToView(true);
+            await me.passSizeToBody(true);
 
-            me.view.updateMountedAndVisibleColumns();
+            me.body.updateMountedAndVisibleColumns();
 
-            await me.headerToolbar.passSizeToView()
+            await me.headerToolbar.passSizeToBody()
         } else {
             me.initialResizeEvent = false
         }
@@ -561,7 +561,7 @@ class GridContainer extends BaseContainer {
 
         me.store.sort(opts);
         me.removeSortingCss(opts.property);
-        opts.direction && me.view.onStoreLoad()
+        opts.direction && me.body.onStoreLoad()
     }
 
     /**
@@ -589,16 +589,16 @@ class GridContainer extends BaseContainer {
      * @param {Boolean} silent=false
      * @returns {Promise<void>}
      */
-    async passSizeToView(silent=false) {
+    async passSizeToBody(silent=false) {
         let me                          = this,
             [containerRect, headerRect] = await me.getDomRect([me.id, me.headerToolbarId]);
 
         // delay for slow connections, where the container-sizing is not done yet
         if (containerRect.height === headerRect.height) {
             await me.timeout(100);
-            await me.passSizeToView(silent)
+            await me.passSizeToBody(silent)
         } else {
-            me.view[silent ? 'setSilent' : 'set']({
+            me.body[silent ? 'setSilent' : 'set']({
                 availableHeight: containerRect.height - headerRect.height,
                 containerWidth : containerRect.width
             })
@@ -624,8 +624,8 @@ class GridContainer extends BaseContainer {
      */
     scrollByColumns(index, step) {
         let me           = this,
-            {view}       = me,
-            {columnPositions, containerWidth, mountedColumns, visibleColumns} = view,
+            {body}       = me,
+            {columnPositions, containerWidth, mountedColumns, visibleColumns} = body,
             countColumns = columnPositions.getCount(),
             newIndex     = index + step,
             column, mounted, scrollLeft, visible;

package/src/grid/ScrollManager.mjs

@@ -24,15 +24,15 @@ class ScrollManager extends Base {
     }
 
     /**
-     * @member {Neo.grid.Container|null} gridContainer=null
+     * @member {Neo.grid.Body|null} gridBody=null
      * @protected
      */
-    gridContainer = null
+    gridBody = null
     /**
-     * @member {Neo.grid.View|null} gridView=null
+     * @member {Neo.grid.Container|null} gridContainer=null
      * @protected
      */
-    gridView = null
+    gridContainer = null
     /**
      * Storing touchmove position for mobile envs
      * @member {Number} lastTouchX=0
@@ -52,7 +52,7 @@ class ScrollManager extends Base {
     scrollTimeoutId = null
     /**
      * Flag for identifying the ownership of a touchmove operation
-     * @member {'container'|'view'|null} touchMoveOwner=null
+     * @member {'body'|'container'|null} touchMoveOwner=null
      * @protected
      */
     touchMoveOwner = null
@@ -65,19 +65,59 @@ class ScrollManager extends Base {
 
         let me = this;
 
-        me.gridContainer.addDomListeners({
-            scroll: me.onContainerScroll,
-            scope : me
-        });
-
-        me.gridView.addDomListeners({
-            scroll     : me.onViewScroll,
+        me.gridBody.addDomListeners({
+            scroll     : me.onBodyScroll,
             touchcancel: me.onTouchCancel,
             touchend   : me.onTouchEnd,
             scope      : me
+        });
+
+        me.gridContainer.addDomListeners({
+            scroll: me.onContainerScroll,
+            scope : me
         })
     }
 
+    /**
+     * Only triggers for vertical scrolling
+     * @param {Object} data
+     * @protected
+     */
+    onBodyScroll({scrollTop, touches}) {
+        let me   = this,
+            body = me.gridBody,
+            deltaX, lastTouchX;
+
+        me.scrollTop = scrollTop;
+
+        me.scrollTimeoutId && clearTimeout(me.scrollTimeoutId);
+
+        me.scrollTimeoutId = setTimeout(() => {
+            body.isScrolling = false
+        }, 100);
+
+        body.set({isScrolling: true, scrollTop});
+
+        if (touches) {
+            if (me.touchMoveOwner !== 'container') {
+                me.touchMoveOwner = 'body'
+            }
+
+            if (me.touchMoveOwner === 'body') {
+                lastTouchX = touches.lastTouch.clientX - touches.firstTouch.clientX;
+                deltaX     = me.lastTouchX - lastTouchX;
+
+                deltaX !== 0 && Neo.main.DomAccess.scrollTo({
+                    direction: 'left',
+                    id       : me.gridContainer.id,
+                    value    : me.scrollLeft + deltaX
+                })
+
+                me.lastTouchX = lastTouchX
+            }
+        }
+    }
+
     /**
      * @param {Object} data
      * @param {Number} data.scrollLeft
@@ -86,18 +126,18 @@ class ScrollManager extends Base {
      */
     onContainerScroll({scrollLeft, target, touches}) {
         let me    = this,
-            view = me.gridView,
+            body = me.gridBody,
             deltaY, lastTouchY;
 
         // We must ignore events for grid-scrollbar
         if (target.id.includes('grid-container')) {
             me  .scrollLeft = scrollLeft;
-            view.scrollLeft = scrollLeft;
+            body.scrollLeft = scrollLeft;
 
             me.gridContainer.headerToolbar.scrollLeft = scrollLeft;
 
             if (touches && !me.gridContainer.headerToolbar.cls.includes('neo-is-dragging')) {
-                if (me.touchMoveOwner !== 'view') {
+                if (me.touchMoveOwner !== 'body') {
                     me.touchMoveOwner = 'container'
                 }
 
@@ -107,7 +147,7 @@ class ScrollManager extends Base {
 
                     deltaY !== 0 && Neo.main.DomAccess.scrollTo({
                         direction: 'top',
-                        id       : view.vdom.id,
+                        id       : body.vdom.id,
                         value    : me.scrollTop + deltaY
                     })
 
@@ -134,46 +174,6 @@ class ScrollManager extends Base {
         me.lastTouchX     = 0;
         me.lastTouchY     = 0
     }
-
-    /**
-     * Only triggers for vertical scrolling
-     * @param {Object} data
-     * @protected
-     */
-    onViewScroll({scrollTop, touches}) {
-        let me   = this,
-            view = me.gridView,
-            deltaX, lastTouchX;
-
-        me.scrollTop = scrollTop;
-
-        me.scrollTimeoutId && clearTimeout(me.scrollTimeoutId);
-
-        me.scrollTimeoutId = setTimeout(() => {
-            view.isScrolling = false
-        }, 100);
-
-        view.set({isScrolling: true, scrollTop});
-
-        if (touches) {
-            if (me.touchMoveOwner !== 'container') {
-                me.touchMoveOwner = 'view'
-            }
-
-            if (me.touchMoveOwner === 'view') {
-                lastTouchX = touches.lastTouch.clientX - touches.firstTouch.clientX;
-                deltaX     = me.lastTouchX - lastTouchX;
-
-                deltaX !== 0 && Neo.main.DomAccess.scrollTo({
-                    direction: 'left',
-                    id       : me.gridContainer.id,
-                    value    : me.scrollLeft + deltaX
-                })
-
-                me.lastTouchX = lastTouchX
-            }
-        }
-    }
 }
 
 export default Neo.setupClass(ScrollManager);

package/src/grid/VerticalScrollbar.mjs

@@ -53,9 +53,9 @@ class VerticalScrollbar extends Component {
 
         if (mounted) {
             ScrollSync.register({
-                fromId: me.parent.view.vdom.id,
+                fromId: me.parent.body.vdom.id,
                 toId  : me.id,
-                twoWay: !Neo.config.hasTouchEvents, // Syncing the scroller back to the view affects mobile scrolling
+                twoWay: !Neo.config.hasTouchEvents, // Syncing the scroller back to the body affects mobile scrolling
                 ...params
             })
         } else {

package/src/grid/_export.mjs

@@ -1,5 +1,5 @@
 import * as header from './header/_export.mjs';
+import Body        from './Body.mjs';
 import Container   from './Container.mjs';
-import View        from './View.mjs';
 
-export {header, Container, View};
+export {Body, header, Container};

package/src/grid/column/AnimatedChange.mjs

@@ -55,7 +55,7 @@ class AnimatedChange extends Column {
      */
     async onRecordChange({fields, record}) {
         let me     = this,
-            {view} = me.parent,
+            {body} = me.parent,
             cellId, field, node;
 
         for (field of fields) {
@@ -63,16 +63,16 @@ class AnimatedChange extends Column {
                 // Wait for the next animation frame
                 await me.timeout(20);
 
-                cellId = view.getCellId(me.parent.store.indexOf(record), me.dataField);
-                node   = VdomUtil.find(view.vdom, cellId)?.vdom;
+                cellId = body.getCellId(me.parent.store.indexOf(record), me.dataField);
+                node   = VdomUtil.find(body.vdom, cellId)?.vdom;
 
                 if (node) {
                     NeoArray.add(node.cls, me.getAnimationCls(record));
 
-                    // This will trigger a 2nd view update, after grid.View: onStoreRecordChange()
+                    // This will trigger a 2nd body update, after grid.Body: onStoreRecordChange()
                     // It is crucial to restart the keyframe based animation
                     // => The previous update call will remove the last animationCls
-                    view.update()
+                    body.update()
                 }
 
                 break

package/src/grid/column/Base.mjs

@@ -26,7 +26,7 @@ class Column extends Base {
         renderer_: 'cellRenderer',
         /**
          * Scope to execute the column renderer.
-         * Defaults to the grid.View.
+         * Defaults to the grid.Body.
          * You can pass the strings 'this' or 'me'
          * @member {Neo.core.Base|String|null} rendererScope=null
          */

package/src/grid/column/Component.mjs

@@ -76,7 +76,7 @@ class Component extends Column {
      */
     cellRenderer(data) {
         let {gridContainer, record, rowIndex} = data,
-            {appName, view, windowId}         = gridContainer,
+            {appName, body, windowId}         = gridContainer,
             me               = this,
             {recordProperty} = me,
             id               = me.getComponentId(rowIndex),
@@ -104,7 +104,7 @@ class Component extends Column {
                 ...componentConfig,
                 appName,
                 id,
-                parentComponent : view,
+                parentComponent : body,
                 [recordProperty]: record,
                 windowId
             });
@@ -118,10 +118,10 @@ class Component extends Column {
         }
 
         if (me.useBindings) {
-            view.getStateProvider()?.parseConfig(component)
+            body.getStateProvider()?.parseConfig(component)
         }
 
-        view.updateDepth = -1;
+        body.updateDepth = -1;
 
         return component.createVdomReference()
     }
@@ -132,9 +132,9 @@ class Component extends Column {
      */
     getComponentId(rowIndex) {
         let me     = this,
-            {view} = me.parent;
+            {body} = me.parent;
 
-        return `${me.id}-component-${rowIndex % (view.availableRows + 2 * view.bufferRowRange)}`
+        return `${me.id}-component-${rowIndex % (body.availableRows + 2 * body.bufferRowRange)}`
     }
 }
 

package/src/grid/header/Toolbar.mjs

@@ -89,7 +89,7 @@ class Toolbar extends BaseToolbar {
      */
     afterSetMounted(value, oldValue) {
         super.afterSetMounted(value, oldValue);
-        value && this.passSizeToView()
+        value && this.passSizeToBody()
     }
 
     /**
@@ -181,7 +181,7 @@ class Toolbar extends BaseToolbar {
 
         me.promiseUpdate().then(() => {
             // To prevent duplicate calls, we need to check the mounted state before the update call
-            mounted && me.passSizeToView()
+            mounted && me.passSizeToBody()
         })
     }
 
@@ -203,10 +203,10 @@ class Toolbar extends BaseToolbar {
      * @param {Boolean} silent=false
      * @returns {Promise<void>}
      */
-    async passSizeToView(silent=false) {
+    async passSizeToBody(silent=false) {
         let me              = this,
             {items}         = me,
-            {view}          = me.parent,
+            {body}          = me.parent,
             rects           = await me.getDomRect(items.map(item => item.id)),
             lastItem        = rects[rects.length - 1],
             columnPositions = rects.map((item, index) => ({dataField: items[index].dataField, width: item.width, x: item.x - rects[0].x})),
@@ -225,16 +225,16 @@ class Toolbar extends BaseToolbar {
         // Delay for slow connections, where the container-sizing is not done yet
         if (!layoutFinished) {
             await me.timeout(100);
-            await me.passSizeToView(silent)
+            await me.passSizeToBody(silent)
         } else {
-            view.columnPositions.clear();
-            view.columnPositions.add(columnPositions);
+            body.columnPositions.clear();
+            body.columnPositions.add(columnPositions);
 
-            view[silent ? 'setSilent' : 'set']({
+            body[silent ? 'setSilent' : 'set']({
                 availableWidth: lastItem.x + lastItem.width - rects[0].x
             });
 
-            !silent && view.updateMountedAndVisibleColumns()
+            !silent && body.updateMountedAndVisibleColumns()
         }
     }
 

package/src/grid/plugin/AnimateRows.mjs

@@ -1,5 +1,4 @@
 import Base     from '../../plugin/Base.mjs';
-import CssUtil  from '../../util/Css.mjs';
 import NeoArray from '../../util/Array.mjs';
 
 /**
@@ -151,7 +150,7 @@ class AnimateRows extends Base {
 
         for (rowIndex=mountedRows[0]; rowIndex < mountedRows[1]; rowIndex++) {
             record  = owner.store.getAt(rowIndex);
-            id      = owner.getRowId(record, rowIndex)
+            id      = owner.getRowId(rowIndex)
             mapItem = map[id];
 
             if (mapItem) {

package/src/util/Style.mjs

@@ -36,19 +36,15 @@ class Style extends Base {
             return null
         } else if (!oldStyle) {
             return Neo.clone(newStyle)
-        } else if (!newStyle) {
-            Object.keys(oldStyle).forEach(function(style) {
-                styles[style] = null
-            });
         } else {
-            Object.keys(newStyle).forEach(style => {
+            newStyle && Object.keys(newStyle).forEach(style => {
                 if (!oldStyle.hasOwnProperty(style) || oldStyle[style] !== newStyle[style]) {
                     styles[style] = newStyle[style]
                 }
             });
 
             Object.keys(oldStyle).forEach(style => {
-                if (!newStyle.hasOwnProperty(style)) {
+                if (!newStyle  || !newStyle.hasOwnProperty(style)) {
                     styles[style] = null
                 }
             });

package/src/vdom/Helper.mjs

@@ -107,7 +107,7 @@ class Helper extends Base {
                         Object.entries(value).forEach(([key, value]) => {
                             const
                                 oldValue    = oldVnode.attributes[key],
-                                hasOldValue = Object.hasOwn(oldVnode.attributes, 'key');
+                                hasOldValue = Object.hasOwn(oldVnode.attributes, key);
 
                             // If the attribute has an old value AND the value hasn't changed, skip.
                             if (hasOldValue && oldValue === value) {

package/src/worker/App.mjs

@@ -46,11 +46,6 @@ class App extends Base {
         singleton: true
     }
 
-    /**
-     * @member {Object|null} data=null
-     * @protected
-     */
-    data = null
     /**
      * @member {Boolean} isUsingStateProviders=false
      * @protected
@@ -388,23 +383,16 @@ class App extends Base {
      * @param {Object} data
      */
     onLoadApplication(data) {
-        let me       = this,
-            {config} = Neo,
-            app, path;
-
-        if (data) {
-            me.data = data;
-            config.resourcesPath = data.resourcesPath
-        }
-
-        path = me.data.path;
+        let me        = this,
+            {config}  = Neo,
+            {appPath} = config;
 
         if (config.environment !== 'development') {
-            path = path.startsWith('/') ? path.substring(1) : path
+            appPath = appPath.startsWith('/') ? appPath.substring(1) : appPath
         }
 
-        me.importApp(path).then(module => {
-            app = module.onStart();
+        me.importApp(appPath).then(module => {
+            module.onStart();
 
             // short delay to ensure Component Controllers are ready
             config.hash && me.timeout(5).then(() => {

package/src/worker/Manager.mjs

@@ -270,14 +270,10 @@ class Manager extends Base {
     }
 
     /**
-     * @param {String} path
+     *
      */
-    loadApplication(path) {
-        this.sendMessage('app', {
-            action       : 'loadApplication',
-            path,
-            resourcesPath: NeoConfig.resourcesPath
-        })
+    loadApplication() {
+        this.sendMessage('app', {action: 'loadApplication' })
     }
 
     /**
@@ -291,7 +287,7 @@ class Manager extends Base {
         if (me.constructedThreads === me.activeWorkers) {
             // better safe than sorry => all remotes need to be registered
             NeoConfig.appPath && me.timeout(NeoConfig.loadApplicationDelay).then(() => {
-                me.loadApplication(NeoConfig.appPath)
+                me.loadApplication()
             })
         }
     }