ரியாக்ட் ரூட்டர் v6 சோம்பேறி சஸ்பென்ஸுடன் தொடர்புடைய முக்கிய பிரச்சனை என்னவென்றால், இது இன்னும் அனைத்து உலாவிகளாலும் முழுமையாக ஆதரிக்கப்படவில்லை. React Router v6 சோம்பேறி சஸ்பென்ஸைப் பயன்படுத்தி இணையதளங்களில் சில பக்கங்கள் அல்லது அம்சங்களை அணுக முயற்சிக்கும் போது பயனர்கள் சிக்கல்களை சந்திக்க நேரிடும் என்பதே இதன் பொருள். கூடுதலாக, இன்னும் சில பிழைகள் மற்றும் செயல்திறன் சிக்கல்கள் உள்ளன, அவை உற்பத்தி சூழல்களில் பயன்படுத்தப்படுவதற்கு முன்பு கவனிக்கப்பட வேண்டும். இறுதியாக, சஸ்பென்ஸுடன் சோம்பேறி ஏற்றுதல் கூறுகளுக்கான API இன்னும் ஆரம்ப கட்டத்தில் உள்ளது மேலும் ஏற்கனவே உள்ள பயன்பாடுகளுடன் இணக்கத்தன்மையை உறுதிப்படுத்த கூடுதல் மேம்பாட்டு நேரம் தேவைப்படலாம்.
import React, { Suspense } from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
const Home = React.lazy(() => import('./Home'));
const About = React.lazy(() => import('./About'));
const Contact = React.lazy(() => import('./Contact'));
function AppRouter() {
return (
<Router>
<Suspense fallback={<div>Loading...</div>}>
<Switch>
<Route exact path="/" component={Home} />
<Route path="/about" component={About} />
<Route path="/contact" component={Contact} />
</Switch>
</Suspense>
</Router>
);
}
export default AppRouter;
1. இந்தக் குறியீடு ரியாக்ட் லைப்ரரியையும், ரியாக்டிலிருந்து சஸ்பென்ஸ் கூறுகளையும், ரியாக்ட்-ரவுட்டர்-டோமில் இருந்து பிரவுசர் ரூட்டர், ரூட் மற்றும் ஸ்விட்ச் கூறுகளையும் இறக்குமதி செய்கிறது.
2. பின்னர் அது மூன்று கூறுகளை (முகப்பு, பற்றி, தொடர்பு) ரியாக்டின் சோம்பேறி ஏற்றுதல் அம்சத்தைப் பயன்படுத்தி அவற்றை அந்தந்த கோப்புகளிலிருந்து இறக்குமதி செய்ய வரையறுக்கிறது.
3. AppRouter செயல்பாடு வரையறுக்கப்படுகிறது, இது சஸ்பென்ஸ் கூறுகளைக் கொண்ட ரூட்டர் கூறுகளை அதன் உள்ளே ஸ்விட்ச் கூறுகளுடன் வழங்குகிறது.
4. ஸ்விட்ச் கூறுகளின் உள்ளே மூன்று வழி கூறுகள் உள்ளன, அவை ஒவ்வொன்றும் URL இல் அந்தந்த பாதைகள் பொருந்தும்போது இறக்குமதி செய்யப்பட்ட கூறுகளில் ஒன்றை வழங்குகின்றன (எ.கா., முகப்புக்கான '/').
5. இறுதியாக, AppRouter ஏற்றுமதி செய்யப்படுகிறது, இதனால் அது பயன்பாட்டில் வேறு எங்கும் பயன்படுத்தப்படும்.
ரியாக்ட் ரூட்டர் v6 இல் சோம்பேறி ஏற்றுதலை எப்படிப் பயன்படுத்துகிறீர்கள்
v6
சோம்பேறி ஏற்றுதல் என்பது சில கூறுகள் தேவைப்படும் வரை அவற்றை ஏற்றுவதை ஒத்திவைக்கப் பயன்படுத்தப்படும் ஒரு நுட்பமாகும். ரியாக்ட் ரூட்டர் v6 இல், டைனமிக் இறக்குமதி() தொடரியல் மூலம் சோம்பேறி ஏற்றுதலை அடையலாம். இந்த தொடரியல் உங்கள் குறியீட்டை பல மூட்டைகளாகப் பிரிக்க அனுமதிக்கிறது, அவை தேவைக்கேற்ப அல்லது இணையாக ஏற்றப்படும். இது ஆரம்ப மூட்டை அளவைக் குறைக்கவும் செயல்திறனை மேம்படுத்தவும் உதவுகிறது. ரியாக்ட் ரூட்டர் v6 உடன் சோம்பேறி ஏற்றுதலைப் பயன்படுத்த, நீங்கள் சோம்பேறியாக ஏற்ற விரும்பும் கூறுகளை டைனமிக் இறக்குமதி() அழைப்பில் மடிக்க வேண்டும். இறக்குமதி() அழைப்பு ஒரு வாக்குறுதியை வழங்கும்
என்ன சஸ்பென்ஸ் மற்றும் எதிர்வினையில் சோம்பேறித்தனம்
ரியாக்ட் ரூட்டரில் உள்ள சஸ்பென்ஸ் என்பது சில நிபந்தனைகளை பூர்த்தி செய்யும் வரை பாதையை ஏற்றுவதை தாமதப்படுத்தும் ஒரு வழியாகும். தேவைப்படும் போது வழிகளை மட்டும் ஏற்றுவதன் மூலம் பயன்பாட்டின் செயல்திறனை மேம்படுத்த இதைப் பயன்படுத்தலாம். எடுத்துக்காட்டாக, அங்கீகாரம் தேவைப்படும் பக்கத்திற்கு ஒரு பயனர் வழிசெலுத்தினால், அங்கீகாரம் முடியும் வரை பாதை தாமதமாகலாம்.
ரியாக்ட் ரூட்டரில் சோம்பேறி ஏற்றுதல் கூறுகளை ஒரே நேரத்தில் ஏற்றுவதற்குப் பதிலாக தேவைப்படும்போது ஒத்திசைவின்றி ஏற்ற அனுமதிக்கிறது. இது தேவைப்படும் போது கூறுகளை ஏற்றுவதன் மூலம் செயல்திறனை மேம்படுத்துகிறது மற்றும் நெட்வொர்க்கில் மாற்றப்பட வேண்டிய தரவின் அளவைக் குறைக்கிறது. சோம்பேறி ஏற்றுதல் குறியீட்டைப் பிரிப்பதில் உதவுகிறது, பெரிய பயன்பாடுகளை தேவைக்கேற்ப ஏற்றக்கூடிய சிறிய துண்டுகளாக உடைக்க அனுமதிக்கிறது.
