minify bundle size

.eslintrc.js

@@ -42,6 +42,28 @@ module.exports = {
         tsx: 'never',
       },
     ],
+    /*
+    'import/no-extraneous-dependencies': [
+      'error',
+      { devDependencies: false, optionalDependencies: false, peerDependencies: false },
+    ],
+    */
+    'no-restricted-imports': [
+      'error',
+      {
+        paths: [
+          // enforce importing function individually
+          {
+            name: 'lodash',
+            message: 'please use lodash/... instead',
+          },
+          {
+            name: 'nostr-tools',
+            message: 'please use nostr-tools/... instead',
+          },
+        ],
+      },
+    ],
     'import/order': [
       'warn',
       {

src/components/Actions.tsx

@@ -1,6 +1,7 @@
 import {
   type JSX,
   type Component,
+  lazy,
   Switch,
   Match,
   Show,
@@ -20,8 +21,6 @@ import { noteEncode } from 'nostr-tools/nip19';
 import { type Event as NostrEvent } from 'nostr-tools/pure';
 
 import EmojiDisplay from '@/components/EmojiDisplay';
-import EventDebugModal from '@/components/modal/EventDebugModal';
-import UserList from '@/components/modal/UserList';
 import useEmojiPicker, { EmojiData } from '@/components/useEmojiPicker';
 import useContextMenu from '@/components/utils/useContextMenu';
 import useConfig from '@/core/useConfig';
@@ -38,6 +37,9 @@ import ensureNonNull from '@/utils/ensureNonNull';
 import { formatSiPrefix } from '@/utils/siPrefix';
 import timeout from '@/utils/timeout';
 
+const EventDebugModal = lazy(() => import('@/components/modal/EventDebugModal'));
+const UserList = lazy(() => import('@/components/modal/UserList'));
+
 export type ActionProps = {
   event: NostrEvent;
   onClickReply: () => void;

src/components/SideBar.tsx

@@ -1,4 +1,4 @@
-import { createSignal, Show, onMount, onCleanup, type JSX, Component } from 'solid-js';
+import { createSignal, Show, onMount, onCleanup, lazy, type JSX, Component } from 'solid-js';
 
 import Cog6Tooth from 'heroicons/24/outline/cog-6-tooth.svg';
 import Plus from 'heroicons/24/outline/plus.svg';
@@ -6,7 +6,6 @@ import MagnifyingGlass from 'heroicons/24/solid/magnifying-glass.svg';
 import PencilSquare from 'heroicons/24/solid/pencil-square.svg';
 import throttle from 'lodash/throttle';
 
-import Config from '@/components/modal/Config';
 import NotePostForm from '@/components/NotePostForm';
 import usePopup, { type UsePopup } from '@/components/utils/usePopup';
 import { createSearchColumn } from '@/core/column';
@@ -16,6 +15,8 @@ import useModalState from '@/hooks/useModalState';
 import isMobile from '@/utils/isMobile';
 import resolveAsset from '@/utils/resolveAsset';
 
+const Config = lazy(() => import('@/components/modal/Config'));
+
 const useMediaWidth = () => {
   const [innerWidth, setInnerWidth] = createSignal(window.innerWidth);
 

src/components/column/FollwingColumn.tsx

@@ -1,7 +1,7 @@
 import { Component, createEffect, onCleanup, onMount } from 'solid-js';
 
 import Home from 'heroicons/24/outline/home.svg';
-import { uniq } from 'lodash';
+import uniq from 'lodash/uniq';
 
 import BasicColumnHeader from '@/components/column/BasicColumnHeader';
 import Column from '@/components/column/Column';

src/components/column/LoadMore.tsx

@@ -8,7 +8,7 @@ import {
   type Component,
 } from 'solid-js';
 
-import { type Event as NostrEvent } from 'nostr-tools';
+import { type Event as NostrEvent } from 'nostr-tools/pure';
 
 import ColumnItem from '@/components/ColumnItem';
 import useScroll from '@/hooks/useScroll';

src/components/modal/GlobalModal.tsx

@@ -1,13 +1,14 @@
-import { Show, Switch, Match, Component } from 'solid-js';
+import { lazy, Show, Switch, Match, Component } from 'solid-js';
 
-import About from '@/components/modal/About';
-import AddColumn from '@/components/modal/AddColumn';
-import ProfileDisplay from '@/components/modal/ProfileDisplay';
-import ProfileEdit from '@/components/modal/ProfileEdit';
 import useModalState from '@/hooks/useModalState';
 import usePubkey from '@/nostr/usePubkey';
 import ensureNonNull from '@/utils/ensureNonNull';
 
+const About = lazy(() => import('@/components/modal/About'));
+const AddColumn = lazy(() => import('@/components/modal/AddColumn'));
+const ProfileDisplay = lazy(() => import('@/components/modal/ProfileDisplay'));
+const ProfileEdit = lazy(() => import('@/components/modal/ProfileEdit'));
+
 const GlobalModal: Component = () => {
   const pubkey = usePubkey();
   const { modalState, showProfile, closeModal } = useModalState();

src/core/useConfig.ts

@@ -1,6 +1,6 @@
 import { createRoot, type Accessor, type Setter } from 'solid-js';
 
-import { sortBy } from 'lodash';
+import sortBy from 'lodash/sortBy';
 import uniq from 'lodash/uniq';
 import * as Kind from 'nostr-tools/kinds';
 import { type Event as NostrEvent } from 'nostr-tools/pure';

src/nostr/query.ts

@@ -1,5 +1,5 @@
 import { QueryClient, QueryKey } from '@tanstack/solid-query';
-import { uniqBy } from 'lodash';
+import uniqBy from 'lodash/uniqBy';
 import { Event as NostrEvent } from 'nostr-tools/pure';
 
 import { compareEvents, pickLatestEvent, sortEvents } from '@/nostr/event/comparator';

src/nostr/useLnurlEndpoint.ts

@@ -1,7 +1,7 @@
 import { createMemo } from 'solid-js';
 
 import { createQuery } from '@tanstack/solid-query';
-import { type Event as NostrEvent } from 'nostr-tools';
+import { type Event as NostrEvent } from 'nostr-tools/pure';
 
 import isValidId from '@/nostr/event/isValidId';
 import { fetchLnurlEndpoint, verifyZapReceipt, type LnurlEndpoint } from '@/nostr/zap';