optimize rule page performance

This commit is contained in:
pompurin404 2024-08-05 15:41:04 +08:00
parent 951cd85c12
commit d68b2686f7
No known key found for this signature in database
2 changed files with 9 additions and 12 deletions

View File

@ -4,7 +4,7 @@ import React from 'react'
const RuleItem: React.FC<IMihomoRulesDetail> = (props) => {
const { type, payload, proxy } = props
return (
<Card className="m-2">
<Card className="mb-2 mx-2">
<CardBody className="flex justify-between">
<div className="flex justify-between">
<div className="select-none">{type}</div>

View File

@ -1,5 +1,6 @@
import BasePage from '@renderer/components/base/base-page'
import RuleItem from '@renderer/components/rules/rule-item'
import { Virtuoso } from 'react-virtuoso'
import { useMemo, useState } from 'react'
import { Input } from '@nextui-org/react'
import useSWR from 'swr'
@ -31,17 +32,13 @@ const Rules: React.FC = () => {
onValueChange={setFilter}
/>
</div>
{filteredRules.map((rule, index) => {
return (
<RuleItem
key={rule.payload + index}
type={rule.type}
payload={rule.payload}
proxy={rule.proxy}
size={rule.size}
/>
)
})}
<Virtuoso
style={{ height: 'calc(100vh - 100px)' }}
data={filteredRules}
itemContent={(_, rule) => (
<RuleItem type={rule.type} payload={rule.payload} proxy={rule.proxy} size={rule.size} />
)}
/>
</BasePage>
)
}