diff --git a/web/app/components/app/log/index.tsx b/web/app/components/app/log/index.tsx
index cedf2de74d..4fda71bece 100644
--- a/web/app/components/app/log/index.tsx
+++ b/web/app/components/app/log/index.tsx
@@ -27,24 +27,33 @@ export type QueryParam = {
   sort_by?: string
 }
 
+const defaultQueryParams: QueryParam = {
+  period: '2',
+  annotation_status: 'all',
+  sort_by: '-created_at',
+}
+
+const logsStateCache = new Map<string, {
+  queryParams: QueryParam
+  currPage: number
+  limit: number
+}>()
+
 const Logs: FC<ILogsProps> = ({ appDetail }) => {
   const { t } = useTranslation()
   const router = useRouter()
   const pathname = usePathname()
   const searchParams = useSearchParams()
-  const [queryParams, setQueryParams] = useState<QueryParam>({
-    period: '2',
-    annotation_status: 'all',
-    sort_by: '-created_at',
-  })
   const getPageFromParams = useCallback(() => {
     const pageParam = Number.parseInt(searchParams.get('page') || '1', 10)
     if (Number.isNaN(pageParam) || pageParam < 1)
       return 0
     return pageParam - 1
   }, [searchParams])
-  const [currPage, setCurrPage] = React.useState<number>(() => getPageFromParams())
-  const [limit, setLimit] = React.useState<number>(APP_PAGE_LIMIT)
+  const cachedState = logsStateCache.get(appDetail.id)
+  const [queryParams, setQueryParams] = useState<QueryParam>(cachedState?.queryParams ?? defaultQueryParams)
+  const [currPage, setCurrPage] = React.useState<number>(() => cachedState?.currPage ?? getPageFromParams())
+  const [limit, setLimit] = React.useState<number>(cachedState?.limit ?? APP_PAGE_LIMIT)
   const debouncedQueryParams = useDebounce(queryParams, { wait: 500 })
 
   useEffect(() => {
@@ -52,6 +61,14 @@ const Logs: FC<ILogsProps> = ({ appDetail }) => {
     setCurrPage(prev => (prev === pageFromParams ? prev : pageFromParams))
   }, [getPageFromParams])
 
+  useEffect(() => {
+    logsStateCache.set(appDetail.id, {
+      queryParams,
+      currPage,
+      limit,
+    })
+  }, [appDetail.id, currPage, limit, queryParams])
+
   // Get the app type first
   const isChatMode = appDetail.mode !== AppModeEnum.COMPLETION
 
@@ -85,6 +102,11 @@ const Logs: FC<ILogsProps> = ({ appDetail }) => {
 
   const total = isChatMode ? chatConversations?.total : completionConversations?.total
 
+  const handleQueryParamsChange = useCallback((next: QueryParam) => {
+    setCurrPage(0)
+    setQueryParams(next)
+  }, [])
+
   const handlePageChange = useCallback((page: number) => {
     setCurrPage(page)
     const params = new URLSearchParams(searchParams.toString())
@@ -101,7 +123,7 @@ const Logs: FC<ILogsProps> = ({ appDetail }) => {
     <div className='flex h-full grow flex-col'>
       <p className='system-sm-regular shrink-0 text-text-tertiary'>{t('appLog.description')}</p>
       <div className='flex max-h-[calc(100%-16px)] flex-1 grow flex-col py-4'>
-        <Filter isChatMode={isChatMode} appId={appDetail.id} queryParams={queryParams} setQueryParams={setQueryParams} />
+        <Filter isChatMode={isChatMode} appId={appDetail.id} queryParams={queryParams} setQueryParams={handleQueryParamsChange} />
         {total === undefined
           ? <Loading type='app' />
           : total > 0