diff --git a/libs/shared/src/lib/components/filter/filter-row/filter-row.component.html b/libs/shared/src/lib/components/filter/filter-row/filter-row.component.html
index 19603c0ef9..b67c79d97b 100644
--- a/libs/shared/src/lib/components/filter/filter-row/filter-row.component.html
+++ b/libs/shared/src/lib/components/filter/filter-row/filter-row.component.html
@@ -138,13 +138,19 @@
         <ui-select-option>{{
           'common.input.none' | translate
         }}</ui-select-option>
-        <ui-select-option
-          *ngFor="let option of field.options"
-          [value]="option.value"
+        <cdk-virtual-scroll-viewport
+          itemSize="30"
+          class="virtual-scroll-viewport"
         >
-          {{ option.text }}
-        </ui-select-option>
+          <ui-select-option
+            *cdkVirtualFor="let option of field.options"
+            [value]="option.value"
+          >
+            {{ option.text }}
+          </ui-select-option>
+        </cdk-virtual-scroll-viewport>
       </ui-select-menu>
+
       <ui-select-menu
         [filterable]="true"
         *ngIf="field.multiSelect"
@@ -154,12 +160,17 @@
         <ui-select-option>{{
           'common.input.none' | translate
         }}</ui-select-option>
-        <ui-select-option
-          *ngFor="let option of field.options"
-          [value]="option.value"
+        <cdk-virtual-scroll-viewport
+          itemSize="30"
+          class="virtual-scroll-viewport"
         >
-          {{ option.text }}
-        </ui-select-option>
+          <ui-select-option
+            *cdkVirtualFor="let option of field.options"
+            [value]="option.value"
+          >
+            {{ option.text }}
+          </ui-select-option>
+        </cdk-virtual-scroll-viewport>
       </ui-select-menu>
     </div>
   </ng-template>
diff --git a/libs/shared/src/lib/components/filter/filter-row/filter-row.component.scss b/libs/shared/src/lib/components/filter/filter-row/filter-row.component.scss
index 2aa854266c..e09078d599 100644
--- a/libs/shared/src/lib/components/filter/filter-row/filter-row.component.scss
+++ b/libs/shared/src/lib/components/filter/filter-row/filter-row.component.scss
@@ -5,3 +5,9 @@
     gap: 8px;
   }
 }
+
+.virtual-scroll-viewport {
+  height: 200px; /* Adjust height as needed */
+  overflow: hidden;
+  display: block;
+}
diff --git a/libs/shared/src/lib/components/filter/filter.module.ts b/libs/shared/src/lib/components/filter/filter.module.ts
index 210192a66a..0b0686aac2 100644
--- a/libs/shared/src/lib/components/filter/filter.module.ts
+++ b/libs/shared/src/lib/components/filter/filter.module.ts
@@ -12,6 +12,7 @@ import {
   DateModule,
   TooltipModule,
 } from '@oort-front/ui';
+import { ScrollingModule } from '@angular/cdk/scrolling';
 
 /**
  * Composite Filter module.
@@ -29,6 +30,7 @@ import {
     DateModule,
     FormWrapperModule,
     TooltipModule,
+    ScrollingModule,
   ],
   exports: [FilterComponent],
 })