?? ?? : ???? ?
• ?? ??? ??? ???? Usecallback ? Usememo? ?? ??? ????? ???? ???? ????? ?? ? ? ????. ???? ?? ?? ????? :
• ? ?? ????? ?? ?? ????? ?? ??? ? ? ????. ? ?? ??? ?? ?? ??? ????????. ? ??? Usecallback ??? ???? ??? ??? ? ??? ??? ????? ?? ???? ?? Usememo ??? ? ?? ??? ?????. ??? ???? ???? ?? ??? ?? ? ??? ???? ??? ???? ?? ?? ?????? ???? ???? ???? ?????.

??? ?? ? ??? ??? ???? ?? ??? ??? ????? ??? ??? ???? ??? ?? ?????. ??? ??? ??? ????,? ??? ?? ??? ???? ??? ?? ?? ?????. ?? ?? ??? ??? ?? ??? ??? ???? ???? ??? ??? ? ??? ?? ???? ? ??? ???? ??? ???? ???? ?? ???? ?? ?????. ?? ??? ?? ???? ? ?? ??? ??? ??? ??? ??? ?? ? ? ??? ??? ???? ?? ?????.

?? ??? ?? ??? ??? ?????? ?? ??? ???? ??? ?? ???? ?? ??? ??? ?????. ? ??? ??????? ????? ?? ????? ??????.

??? ???. ??? ??? ??? ?? ???? ?? ? ?? ??? ?? ?????. ?, ? ??? ??? ?? ??? ??? ??? ???? ?? ????? ?? ??? ??. ? ???? ??? ???? ??? ? ??? ??? ?? ? ?? ?????.
• ??? ??? ???. ??? ?? ????? ????? ???? ??? ?? ??? ?? ??? ?? ????????. ?? ??? ??? ??? ???? ?? ??? ???? ??? ???? ?? ? ????.
???? ??? ??. ?? ??? ??? ??? ??? ? ??? ??? ?? ??????? ???????. ??? ?? ??? ????? ????? ???? ?? ???? ?? ??? ??? ?? ????? ? ?? ? ? ????. ??? ??? ??? ??? ???? ?? ??? ??????.
• ???? ??? ?? ??? ?????. ?? ?? ???? ??? ??? ??, ?? ???? ? ??? ?? ??? ??? ?????? ???? ??? ?? ??? ??? ??? ???? ?? ????. ? ??? ??? ???? ??? ???? ??? ??? ?????? ??? ??? ???? ?? ???? ?? ???? ????.
• ?? ?? ?? : ?? PHP ?
?? ????? ?? ? ??? ??? ?? ???? ??? ????? ??? ?????. PHP ????? ?? ??? ????? ??? ?? ????? ?? ????? ??? ????. ??? ??? ?? {} ??? ???? ?? ?? ?????.
• ? PHP ??? ??? ?? ??? ???? ??????? ? ?? ?? FetchDataa? FetchDatab? ????. ?? {} ??? ?????? ??? ??? ??? ????? ? ?? ??? ??? ?? ? ??? ??? ?? ????. ?? ??? ?? ? ?? ??? ?? ???? ??? ??? ?? ???? ??? ?????.

?????? ????? ?? ? ? ??? ??? ??? ?? ?????. ??? ?? ??? ??? ??? ??????? ??? ???????. ?? ??? ?????? ???? ??? ?? Lazy Loading? ? ??? ?? ??? ??? ????? ??? ?? ????? ??? ?? ?? ???? ????. ? ??? ? ? ????? ?? ??? ????? ???? ?? ?? ??? ??? ?? ??? ???? ??? ???????. ?? ?? ??

import React, { useState, useEffect } from 'react';
import axios from 'axios';

function PrefetchComponent() {
    const [data, setData] = useState(null);
    const [showSecondComponent, setShowSecondComponent] = useState(false);
    // 在組件完成渲染后立即預(yù)取數(shù)據(jù)
    useEffect(() => {
        axios.get('https://api.example.com/data-to-prefetch')
            .then(response => {
                setData(response.data);
            });
    }, []);
    return (
        <div>
             setShowSecondComponent(true)}>
                顯示下一個組件

            {showSecondComponent && <SecondComponent data={data} />}
        </div>
    );
}
function SecondComponent({ data }) {
    // 在此組件中使用預(yù)取的數(shù)據(jù)
    return (
        <div>
            {data ? <div>這是預(yù)取的數(shù)據(jù)：{data}</div> : <div>加載中...</div>}
        </div>
    );
}
export default PrefetchComponent;

import React, { useState, useEffect } from 'react';
import axios from 'axios';

function PrefetchComponent() {
    const [data, setData] = useState(null);
    const [showSecondComponent, setShowSecondComponent] = useState(false);
    // 在組件完成渲染后立即預(yù)取數(shù)據(jù)
    useEffect(() => {
        axios.get('https://api.example.com/data-to-prefetch')
            .then(response => {
                setData(response.data);
            });
    }, []);
    return (
        <div>
             setShowSecondComponent(true)}>
                顯示下一個組件

            {showSecondComponent && <SecondComponent data={data} />}
        </div>
    );
}
function SecondComponent({ data }) {
    // 在此組件中使用預(yù)取的數(shù)據(jù)
    return (
        <div>
            {data ? <div>這是預(yù)取的數(shù)據(jù)：{data}</div> : <div>加載中...</div>}
        </div>
    );
}
export default PrefetchComponent;