feat: add enable partial load setting to GUI

src/main/invoke-manager.ts

@@ -81,6 +81,10 @@ export class InvokeManager {
       env.INVOKEAI_HOST = '0.0.0.0';
     }
 
+    if (this.store.get('enablePartialLoading')) {
+      env.INVOKEAI_ENABLE_PARTIAL_LOADING = '1';
+    }
+
     // Some torch operations are not yet supported on MPS. This tells torch to use CPU for those operations.
     // See: https://pytorch.org/docs/stable/mps_environment_variables.html
     if (process.platform === 'darwin') {

src/renderer/features/SettingsModal/SettingsModal.tsx

@@ -14,6 +14,7 @@ import {
 import { useStore } from '@nanostores/react';
 import { memo, useCallback } from 'react';
 
+import { SettingsModalEnablePartialLoading } from '@/renderer/features/SettingsModal/SettingsModalEnablePartialLoading';
 import { SettingsModalNotifyForPrereleaseUpdates } from '@/renderer/features/SettingsModal/SettingsModalNotifyForPrereleaseUpdates';
 import { SettingsModalResetButton } from '@/renderer/features/SettingsModal/SettingsModalResetButton';
 import { SettingsModalServerMode } from '@/renderer/features/SettingsModal/SettingsModalServerMode';
@@ -36,6 +37,8 @@ export const SettingsModal = memo(() => {
           <SettingsModalServerMode />
           <Divider />
           <SettingsModalNotifyForPrereleaseUpdates />
+          <Divider />
+          <SettingsModalEnablePartialLoading />
         </ModalBody>
         <ModalFooter pt={16}>
           <SettingsModalResetButton />

src/renderer/features/SettingsModal/SettingsModalEnablePartialLoading.tsx

@@ -0,0 +1,30 @@
+import { Checkbox, Flex, FormControl, FormHelperText, FormLabel } from '@invoke-ai/ui-library';
+import { useStore } from '@nanostores/react';
+import type { ChangeEvent } from 'react';
+import { memo, useCallback } from 'react';
+
+import { persistedStoreApi } from '@/renderer/services/store';
+
+export const SettingsModalEnablePartialLoading = memo(() => {
+  const { enablePartialLoading } = useStore(persistedStoreApi.$atom);
+  const onChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {
+    persistedStoreApi.setKey('enablePartialLoading', e.target.checked);
+  }, []);
+
+  return (
+    <FormControl orientation="vertical">
+      <Flex w="full" alignItems="center" justifyContent="space-between">
+        <FormLabel>Enable Partial Loading</FormLabel>
+        <Checkbox isChecked={enablePartialLoading} onChange={onChange} />
+      </Flex>
+      <FormHelperText>
+        When loading models, if it won&apos;t fit in the available VRAM, it will be loaded by layer. This prevents out
+        of memory errors at the cost of generation speed.
+      </FormHelperText>
+      <FormHelperText>
+        When disabled, if a model will not fit in VRAM, you will get an out of memory error.
+      </FormHelperText>
+    </FormControl>
+  );
+});
+SettingsModalEnablePartialLoading.displayName = 'SettingsModalEnablePartialLoading';

src/renderer/features/SettingsModal/SettingsModalNotifyForPrereleaseUpdates.tsx

@@ -1,13 +1,14 @@
 import { Checkbox, Flex, FormControl, FormHelperText, FormLabel } from '@invoke-ai/ui-library';
 import { useStore } from '@nanostores/react';
+import type { ChangeEvent } from 'react';
 import { memo, useCallback } from 'react';
 
 import { persistedStoreApi } from '@/renderer/services/store';
 
 export const SettingsModalNotifyForPrereleaseUpdates = memo(() => {
   const { notifyForPrereleaseUpdates } = useStore(persistedStoreApi.$atom);
-  const onChange = useCallback(() => {
-    persistedStoreApi.setKey('notifyForPrereleaseUpdates', !persistedStoreApi.$atom.get().notifyForPrereleaseUpdates);
+  const onChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {
+    persistedStoreApi.setKey('notifyForPrereleaseUpdates', e.target.checked);
   }, []);
 
   return (

src/shared/types.ts

@@ -51,6 +51,7 @@ export type StoreData = {
   notifyForPrereleaseUpdates: boolean;
   launcherWindowProps?: WindowProps;
   appWindowProps?: WindowProps;
+  enablePartialLoading?: boolean;
 };
 
 // The electron store uses JSON schema to validate its data.
@@ -90,6 +91,10 @@ export const schema: Schema<StoreData> = {
     type: 'boolean',
     default: true,
   },
+  enablePartialLoading: {
+    type: 'boolean',
+    default: true,
+  },
   launcherWindowProps: winSizePropsSchema,
   appWindowProps: winSizePropsSchema,
 };