React experimental_TracingMarker பற்றிய ஆழமான பார்வை: ட்ரேசிங் செயல்படுத்துவதற்கான ஒரு முழுமையான வழிகாட்டி

செயல்திறன் மிக்க மற்றும் பராமரிக்கக்கூடிய செயலிகளை உருவாக்க டெவலப்பர்களுக்கு React பல்வேறு கருவிகளையும் API-களையும் வழங்குகிறது. அத்தகைய ஒரு கருவி, தற்போது சோதனை நிலையில் உள்ளது, experimental_TracingMarker. இந்த வலைப்பதிவு உங்கள் React செயலிகளை ட்ரேசிங் மற்றும் டீபக்கிங் செய்ய experimental_TracingMarker-ஐப் புரிந்துகொள்வதற்கும், செயல்படுத்துவதற்கும், பயன்படுத்துவதற்கும் ஒரு முழுமையான வழிகாட்டியை வழங்குகிறது.

React experimental_TracingMarker என்றால் என்ன?

experimental_TracingMarker என்பது உங்கள் செயலியின் செயல்பாட்டு ஓட்டத்தையும் செயல்திறனையும் கண்டறிய உதவும் ஒரு React கூறு ஆகும். இது உங்கள் குறியீட்டின் குறிப்பிட்ட பகுதிகளைக் குறிக்க உங்களை அனுமதிக்கிறது, இதனால் இடையூறுகளைக் கண்டறிந்து, உங்கள் செயலியின் வெவ்வேறு பகுதிகள் எவ்வாறு தொடர்பு கொள்கின்றன என்பதைப் புரிந்துகொள்வது எளிதாகிறது. இந்தத் தகவல் React DevTools Profiler-ல் காட்சிப்படுத்தப்படுகிறது, இது திரைக்குப் பின்னால் என்ன நடக்கிறது என்பதைப் பற்றிய தெளிவான படத்தைக் காட்டுகிறது.

இதை உங்கள் குறியீட்டின் செயல்பாட்டுப் பாதையில் பிரெட்கிரம்ப்ஸைச் சேர்ப்பது போல நினைத்துக் கொள்ளுங்கள். நீங்கள் இந்த பிரெட்கிரம்ப்ஸ்களை (experimental_TracingMarker கூறுகள்) முக்கிய இடங்களில் வைக்கிறீர்கள், மற்றும் React Profiler அந்தப் பாதையைப் பின்பற்ற உங்களை அனுமதிக்கிறது, இது நிகழ்வுகளின் வரிசையையும் ஒவ்வொரு குறிக்கப்பட்ட பிரிவிலும் செலவழித்த நேரத்தையும் வெளிப்படுத்துகிறது.

Important Note: பெயர் குறிப்பிடுவது போலவே, experimental_TracingMarker தற்போது ஒரு சோதனை அம்சமாகும். இதன் பொருள், எதிர்கால React வெளியீடுகளில் அதன் API மற்றும் நடத்தை மாறக்கூடும். இதை எச்சரிக்கையுடன் பயன்படுத்தவும், தேவைப்பட்டால் உங்கள் குறியீட்டை மாற்றியமைக்கத் தயாராக இருக்கவும்.

ட்ரேசிங் மார்க்கர்களை ஏன் பயன்படுத்த வேண்டும்?

React செயலிகளை டீபக்கிங் மற்றும் மேம்படுத்தும் போது ட்ரேசிங் மார்க்கர்கள் பல நன்மைகளை வழங்குகின்றன:

• மேம்பட்ட செயல்திறன் பகுப்பாய்வு: உங்கள் குறியீட்டின் மெதுவாக இயங்கும் பகுதிகளைக் கண்டறிந்து செயல்திறன் இடையூறுகளைத் துல்லியமாகக் கண்டறியுங்கள்.
• மேம்படுத்தப்பட்ட டீபக்கிங்: உங்கள் செயலியின் செயல்பாட்டு ஓட்டத்தைப் புரிந்துகொண்டு, பிழைகளைக் கண்டறிவதை எளிதாக்குங்கள்.
• சிறந்த ஒத்துழைப்பு: ஒத்துழைப்பு மற்றும் அறிவுப் பகிர்வை எளிதாக்க மற்ற டெவலப்பர்களுடன் ட்ரேசிங் தரவைப் பகிரவும்.
• காட்சிப்படுத்தல்: செயலியின் நடத்தையை இன்னும் உள்ளுணர்வாகப் புரிந்துகொள்ள React Profiler-ல் ட்ரேசிங் தரவைக் காட்சிப்படுத்துங்கள்.
• இலக்கு வைக்கப்பட்ட மேம்படுத்தல்: செயல்திறனில் மிகப்பெரிய தாக்கத்தை ஏற்படுத்தும் உங்கள் குறியீட்டின் பகுதிகளில் மேம்படுத்தல் முயற்சிகளை மையப்படுத்துங்கள்.

experimental_TracingMarker-ஐ எப்படி செயல்படுத்துவது

experimental_TracingMarker-ஐ செயல்படுத்துவது ஒப்பீட்டளவில் நேரடியானது. இதோ ஒரு படிப்படியான வழிகாட்டி:

1. நிறுவுதல்

முதலில், சோதனை அம்சங்களை ஆதரிக்கும் React பதிப்பைப் பயன்படுத்துவதை உறுதிப்படுத்திக் கொள்ளுங்கள். React மற்றும் React DOM-இன் சமீபத்திய பதிப்பை நிறுவவும்:

            npm install react react-dom

            

              
                Copy
              
            
          

2. experimental_TracingMarker-ஐ இறக்குமதி செய்தல்

react-லிருந்து experimental_TracingMarker கூறுகளை இறக்குமதி செய்யவும்:

            import { unstable_TracingMarker as TracingMarker } from 'react';

            

              
                Copy
              
            
          

unstable_ முன்னொட்டைக் கவனியுங்கள். இது API சோதனைக்குரியது மற்றும் மாற்றத்திற்கு உட்பட்டது என்பதைக் குறிக்கிறது. சுருக்கத்திற்காக அதை `TracingMarker` என்றும் மாற்றுப்பெயர் கொடுத்துள்ளோம்.

3. TracingMarker உடன் குறியீட்டை உறைத்தல்

நீங்கள் ட்ரேஸ் செய்ய விரும்பும் உங்கள் குறியீட்டின் பகுதிகளை TracingMarker கூறுடன் உறைக்கவும். ப்ரொஃபைலரில் ஒவ்வொரு மார்க்கரையும் அடையாளம் காண நீங்கள் ஒரு தனித்துவமான id ப்ராப்பை வழங்க வேண்டும், மற்றும் விருப்பப்பட்டால் சிறந்த வாசிப்புக்கு ஒரு label-ஐயும் வழங்கலாம்.

Example:

            import React, { useState, useEffect, unstable_TracingMarker as TracingMarker } from 'react';

function MyComponent() {
  const [data, setData] = useState(null);

  useEffect(() => {
    async function fetchData() {
        
        const response = await fetch('https://api.example.com/data');
        const json = await response.json();
        setData(json);
      
    }

    fetchData();
  }, []);

  return (
    

      
        {data ? 
Data: {JSON.stringify(data)}
 : 
Loading...
}
      
    
  );
}

export default MyComponent;

            

              
                Copy
              
            
          

இந்த எடுத்துக்காட்டில், fetchData செயல்பாடு மற்றும் கூறின் ரெண்டரிங் லாஜிக்கை TracingMarker கூறுகளுடன் உறைத்துள்ளோம். id ப்ராப் ஒவ்வொரு மார்க்கருக்கும் ஒரு தனித்துவமான அடையாளங்காட்டியை வழங்குகிறது, மற்றும் label ப்ராப் மனிதர்களால் படிக்கக்கூடிய விளக்கத்தை வழங்குகிறது.

4. React Profiler-ஐப் பயன்படுத்துதல்

ட்ரேசிங் தரவைப் பார்க்க, நீங்கள் React Profiler-ஐப் பயன்படுத்த வேண்டும். ப்ரொஃபைலர் React DevTools-ல் கிடைக்கிறது. அதை எப்படி பயன்படுத்துவது என்பது இங்கே:

1. React DevTools-ஐ நிறுவவும்: நீங்கள் இன்னும் நிறுவவில்லை என்றால், React DevTools உலாவி நீட்டிப்பை நிறுவவும்.
2. ப்ரொஃபைலிங்கை இயக்கவும்: React DevTools-ல், Profiler தாவலுக்குச் செல்லவும்.
3. ஒரு சுயவிவரத்தைப் பதிவு செய்யவும்: உங்கள் செயலியை ப்ரொஃபைல் செய்யத் தொடங்க "Record" பொத்தானைக் கிளிக் செய்யவும்.
4. உங்கள் செயலியுடன் தொடர்பு கொள்ளவும்: நீங்கள் பகுப்பாய்வு செய்ய விரும்பும் செயல்களைச் செய்யவும்.
5. ப்ரொஃபைலிங்கை நிறுத்தவும்: ப்ரொஃபைலிங்கை நிறுத்த "Stop" பொத்தானைக் கிளிக் செய்யவும்.
6. முடிவுகளைப் பகுப்பாய்வு செய்யவும்: ப்ரொஃபைலர் உங்கள் செயலியின் செயல்பாட்டின் ஒரு காலவரிசையைக் காண்பிக்கும், இதில் நீங்கள் சேர்த்த ட்ரேசிங் மார்க்கர்களும் அடங்கும்.

React Profiler ஒவ்வொரு குறிக்கப்பட்ட பகுதியின் கால அளவையும் காண்பிக்கும், இது செயல்திறன் இடையூறுகளை விரைவாக அடையாளம் காண உங்களை அனுமதிக்கிறது.

ட்ரேசிங் மார்க்கர்களைப் பயன்படுத்துவதற்கான சிறந்த நடைமுறைகள்

ட்ரேசிங் மார்க்கர்களில் இருந்து அதிகப் பலன்களைப் பெற, இந்த சிறந்த நடைமுறைகளைக் கருத்தில் கொள்ளுங்கள்:

• அர்த்தமுள்ள ID-கள் மற்றும் லேபிள்களைத் தேர்வுசெய்யவும்: ஒவ்வொரு மார்க்கரின் நோக்கத்தையும் தெளிவாக அடையாளம் காட்டும் விளக்கமான ID-கள் மற்றும் லேபிள்களைப் பயன்படுத்தவும். இது React Profiler-ல் ட்ரேசிங் தரவைப் புரிந்துகொள்வதை எளிதாக்கும்.
• முக்கியமான பகுதிகளில் கவனம் செலுத்துங்கள்: ஒவ்வொரு குறியீட்டு வரியையும் ட்ரேசிங் மார்க்கர்களுடன் உறைக்க வேண்டாம். செயல்திறன் இடையூறுகளாக இருக்கக்கூடிய பகுதிகள் அல்லது நீங்கள் நன்கு புரிந்துகொள்ள விரும்பும் பகுதிகளில் கவனம் செலுத்துங்கள்.
• ஒரு சீரான பெயரிடும் மரபைப் பயன்படுத்தவும்: வாசிப்பு மற்றும் பராமரிப்பை மேம்படுத்த உங்கள் ட்ரேசிங் மார்க்கர்களுக்கு ஒரு சீரான பெயரிடும் மரபை நிறுவுங்கள். உதாரணமாக, அனைத்து நெட்வொர்க் கோரிக்கை ட்ரேசிங் மார்க்கர்களையும் "network-" என்றும் அல்லது அனைத்து ரெண்டரிங் தொடர்பான மார்க்கர்களையும் "render-" என்றும் முன்னொட்டு இடலாம்.
• தயாரிப்பில் மார்க்கர்களை அகற்றவும்: ட்ரேசிங் மார்க்கர்கள் உங்கள் செயலிக்கு கூடுதல் சுமையைச் சேர்க்கலாம். செயல்திறனைப் பாதிக்காமல் இருக்க, தயாரிப்பு பில்டுகளில் அவற்றை அகற்றவும் அல்லது நிபந்தனையுடன் முடக்கவும். இந்த நோக்கத்திற்காக நீங்கள் சூழல் மாறிகளைப் பயன்படுத்தலாம்.
• மற்ற ப்ரொஃபைலிங் நுட்பங்களுடன் இணைக்கவும்: ட்ரேசிங் மார்க்கர்கள் ஒரு சக்திவாய்ந்த கருவி, ஆனால் அவை ஒரு மந்திரக்கோல் அல்ல. உங்கள் செயலியின் செயல்திறனைப் பற்றிய விரிவான புரிதலைப் பெற, செயல்திறன் கண்காணிப்புக் கருவிகள் போன்ற பிற ப்ரொஃபைலிங் நுட்பங்களுடன் அவற்றை இணைக்கவும்.

மேம்பட்ட பயன்பாட்டு வழக்குகள்

experimental_TracingMarker-இன் அடிப்படைச் செயல்படுத்தல் எளிமையானது என்றாலும், கருத்தில் கொள்ள வேண்டிய பல மேம்பட்ட பயன்பாட்டு வழக்குகள் உள்ளன:

1. டைனமிக் ட்ரேசிங் மார்க்கர்கள்

சில நிபந்தனைகளின் அடிப்படையில் நீங்கள் ட்ரேசிங் மார்க்கர்களை டைனமிக்காக சேர்க்கலாம் அல்லது அகற்றலாம். இது குறிப்பிட்ட பயனர் தொடர்புகளை ட்ரேஸ் செய்வதற்கோ அல்லது இடைப்பட்ட சிக்கல்களை டீபக் செய்வதற்கோ பயனுள்ளதாக இருக்கும்.

Example:

            import React, { useState, unstable_TracingMarker as TracingMarker } from 'react';

function MyComponent({ shouldTrace }) {
  const [count, setCount] = useState(0);

  const handleClick = () => {
    setCount(count + 1);
  };

  return (
    

      {shouldTrace ? (
        
          Click me ({count})
        
      ) : (
        Click me ({count})
      )}
    
  );
}

export default MyComponent;

            

              
                Copy
              
            
          

இந்த எடுத்துக்காட்டில், shouldTrace ப்ராப் உண்மையாக இருந்தால் மட்டுமே ட்ரேசிங் மார்க்கர் பொத்தானில் சேர்க்கப்படும்.

2. தனிப்பயன் ட்ரேசிங் நிகழ்வுகள்

experimental_TracingMarker முதன்மையாக நேரத்தைக் கணக்கிடுவதில் கவனம் செலுத்தினாலும், குறிக்கப்பட்ட பிரிவுகளுக்குள் தனிப்பயன் நிகழ்வுகளைப் பதிவு செய்வதன் மூலம் அதன் செயல்பாட்டை நீங்கள் நீட்டிக்கலாம். இதற்கு ஒரு பிரத்யேக ட்ரேசிங் நூலகம் அல்லது டெலிமெட்ரி அமைப்புடன் (எ.கா., OpenTelemetry) ஒருங்கிணைக்க வேண்டும்.

3. சர்வர்-சைட் ட்ரேசிங்குடன் ஒருங்கிணைத்தல்

முழு-ஸ்டேக் செயலிகளுக்கு, கோரிக்கை வாழ்க்கைச் சுழற்சியின் முழுமையான படத்தைப் பெற, கிளையன்ட்-சைட் ட்ரேசிங்கை சர்வர்-சைட் ட்ரேசிங்குடன் ஒருங்கிணைக்கலாம். இது கிளையன்ட்டிலிருந்து சர்வருக்கு ட்ரேசிங் சூழலைக் கடத்துவதையும், ட்ரேசிங் தரவைத் தொடர்புபடுத்துவதையும் உள்ளடக்கியது.

உலகெங்கிலும் இருந்து எடுத்துக்காட்டு காட்சிகள்

வெவ்வேறு உலகளாவிய சூழல்களில் experimental_TracingMarker எவ்வாறு பயன்படுத்தப்படலாம் என்பதைக் கருத்தில் கொள்வோம்:

• தென்கிழக்கு ஆசியாவில் இ-காமர்ஸ்: சிங்கப்பூரை தளமாகக் கொண்ட ஒரு இ-காமர்ஸ் நிறுவனம், குறிப்பாக உச்ச நேரங்களில் (பகுதியிலுள்ள வெவ்வேறு தேசிய விடுமுறை நாட்களால் போக்குவரத்து அதிகரிப்பதால்) தயாரிப்பு பக்கங்கள் மெதுவாக ஏற்றுவதைக் கவனிக்கிறது. அவர்கள் experimental_TracingMarker-ஐப் பயன்படுத்தி தயாரிப்பு கூறுகளின் ரெண்டரிங்கை ட்ரேஸ் செய்து, திறமையற்ற பட ஏற்றுதல் தான் இடையூறு என்பதைக் கண்டறிகிறார்கள். பின்னர் அவர்கள் பட அளவுகளை மேம்படுத்தி, சோம்பேறி ஏற்றுதலைச் செயல்படுத்துகிறார்கள். இது சில தென்கிழக்கு ஆசிய நாடுகளில் பெரும்பாலும் மெதுவான இணைய வேகத்திற்கு ஏற்ப செயல்திறனை மேம்படுத்துகிறது.
• ஐரோப்பாவில் ஃபின்டெக்: லண்டனை தளமாகக் கொண்ட ஒரு ஃபின்டெக் ஸ்டார்ட்அப், தங்கள் வர்த்தக தளத்தில் நிகழ்நேர தரவு புதுப்பிப்புகளில் செயல்திறன் சிக்கல்களை எதிர்கொள்கிறது. அவர்கள் experimental_TracingMarker-ஐப் பயன்படுத்தி தரவு ஒத்திசைவு செயல்முறையை ட்ரேஸ் செய்கிறார்கள். அடிக்கடி நிலை புதுப்பிப்புகள் காரணமாக தேவையற்ற மறு-ரெண்டர்கள் தூண்டப்படுவதை அவர்கள் கண்டறிகிறார்கள். அவர்கள் மெமோசேஷன் நுட்பங்களைச் செயல்படுத்தி, தரவு சந்தாக்களை மேம்படுத்தி, மறு-ரெண்டர்களைக் குறைத்து, தளத்தின் பதிலளிப்புத் தன்மையை மேம்படுத்துகிறார்கள். இது ஒரு போட்டி நிதிச் சந்தையில் உயர் செயல்திறன் மிக்க செயலிகளுக்கான தேவையை நிவர்த்தி செய்கிறது.
• தென் அமெரிக்காவில் எட்டெக்: பிரேசிலிய எட்டெக் நிறுவனம், ஒரு ஆன்லைன் கற்றல் தளத்தை உருவாக்கி வருகிறது. அப்பகுதியில் மாணவர்களால் பொதுவாகப் பயன்படுத்தப்படும் பழைய சாதனங்களில் செயல்திறன் சிக்கல்களை எதிர்கொள்கிறது. அவர்கள் experimental_TracingMarker-ஐப் பயன்படுத்தி சிக்கலான ஊடாடும் கற்றல் தொகுதிகளின் ரெண்டரிங்கை ட்ரேஸ் செய்கிறார்கள். அதிகப்படியான ஜாவாஸ்கிரிப்ட் கணக்கீடுகள் மெதுவான வேகத்திற்குக் காரணம் என்று அவர்கள் கண்டறிகிறார்கள். அவர்கள் ஜாவாஸ்கிரிப்ட் குறியீட்டை மேம்படுத்தி, ஆரம்ப பக்க ஏற்றுதலுக்காக சர்வர்-சைட் ரெண்டரிங்கைச் செயல்படுத்துகிறார்கள், இது குறைந்த சக்தி கொண்ட சாதனங்களில் செயல்திறனை மேம்படுத்துகிறது.
• வட அமெரிக்காவில் சுகாதாரம்: கனடாவைச் சேர்ந்த ஒரு சுகாதார வழங்குநர், React-அடிப்படையிலான நோயாளி போர்ட்டலைப் பயன்படுத்தி, இடைப்பட்ட செயல்திறன் சிக்கல்களை எதிர்கொள்கிறார். அவர்கள் experimental_TracingMarker-ஐப் பயன்படுத்தி பயனர் தொடர்புகளை ட்ரேஸ் செய்து, ஒரு குறிப்பிட்ட API எண்ட்பாயிண்ட் எப்போதாவது மெதுவாக இருப்பதைக் கண்டறிகிறார்கள். அவர்கள் கேச்சிங்கைச் செயல்படுத்தி, API எண்ட்பாயிண்டை மேம்படுத்தி, போர்ட்டலின் பதிலளிப்புத் தன்மையை மேம்படுத்தி, நோயாளி தகவலுக்கான சரியான நேர அணுகலை உறுதி செய்கிறார்கள். இது முக்கியமான சுகாதார செயலிகளுக்கு நம்பகமான செயல்திறனில் கவனம் செலுத்துகிறது.

experimental_TracingMarker-க்கு மாற்றுகள்

experimental_TracingMarker ஒரு பயனுள்ள கருவியாக இருந்தாலும், React செயலிகளை ட்ரேசிங் மற்றும் ப்ரொஃபைலிங் செய்வதற்கு வேறு மாற்றுகளும் உள்ளன:

• React Profiler (உள்ளமைக்கப்பட்டது): உள்ளமைக்கப்பட்ட React Profiler எந்த குறியீடு மாற்றங்களும் தேவையில்லாமல் அடிப்படை செயல்திறன் நுண்ணறிவுகளை வழங்குகிறது. இருப்பினும், இது ட்ரேசிங் மார்க்கர்களைப் போன்ற அதே அளவிலான நுணுக்கத்தை வழங்காது.
• செயல்திறன் கண்காணிப்புக் கருவிகள்: New Relic, Sentry, மற்றும் Datadog போன்ற கருவிகள் விரிவான செயல்திறன் கண்காணிப்பு மற்றும் பிழை கண்காணிப்பு திறன்களை வழங்குகின்றன. இவை பெரும்பாலும் தயாரிப்பு கண்காணிப்புக்கு பயன்படுத்தப்படுகின்றன மற்றும் எளிய ட்ரேசிங்கிற்கு அப்பாற்பட்ட அம்சங்களை வழங்குகின்றன.
• OpenTelemetry: OpenTelemetry என்பது ஒரு திறந்த மூல கண்காணிப்பு கட்டமைப்பு ஆகும், இது ட்ரேஸ்கள், மெட்ரிக்குகள் மற்றும் பதிவுகள் உள்ளிட்ட டெலிமெட்ரி தரவைச் சேகரிக்கவும் ஏற்றுமதி செய்யவும் ஒரு நிலையான வழியை வழங்குகிறது. மேலும் விரிவான ட்ரேசிங் தகவலைப் பெற உங்கள் React செயலியுடன் OpenTelemetry-ஐ ஒருங்கிணைக்கலாம்.
• தனிப்பயன் பதிவுசெய்தல்: உங்கள் குறியீட்டில் நிகழ்வுகள் மற்றும் நேரங்களைப் பதிவு செய்ய நிலையான ஜாவாஸ்கிரிப்ட் பதிவு நுட்பங்களைப் பயன்படுத்தலாம். இருப்பினும், இந்த அணுகுமுறை குறைந்த கட்டமைப்பைக் கொண்டது மற்றும் தரவைப் பகுப்பாய்வு செய்ய அதிக கைமுறை முயற்சி தேவைப்படுகிறது.

முடிவுரை

experimental_TracingMarker என்பது React செயலிகளை ட்ரேசிங் மற்றும் டீபக்கிங் செய்வதற்கான ஒரு சக்திவாய்ந்த கருவியாகும். உங்கள் குறியீட்டில் ட்ரேசிங் மார்க்கர்களை உத்தியுடன் வைப்பதன் மூலம், உங்கள் செயலியின் செயல்பாட்டு ஓட்டம் மற்றும் செயல்திறன் பற்றிய மதிப்புமிக்க நுண்ணறிவுகளைப் பெறலாம். இது இன்னும் ஒரு சோதனை அம்சமாக இருந்தாலும், செயல்திறன் பகுப்பாய்வு மற்றும் மேம்படுத்தலுக்கு இது ஒரு நம்பிக்கைக்குரிய அணுகுமுறையை வழங்குகிறது. இதை பொறுப்புடன் பயன்படுத்த நினைவில் கொள்ளுங்கள் மற்றும் எதிர்கால React வெளியீடுகளில் ஏற்படக்கூடிய API மாற்றங்களுக்குத் தயாராக இருங்கள். experimental_TracingMarker-ஐ மற்ற ப்ரொஃபைலிங் நுட்பங்கள் மற்றும் கருவிகளுடன் இணைப்பதன் மூலம், உங்கள் இருப்பிடம் அல்லது உங்கள் உலகளாவிய பார்வையாளர்களின் குறிப்பிட்ட சவால்களைப் பொருட்படுத்தாமல், அதிக செயல்திறன் மிக்க மற்றும் பராமரிக்கக்கூடிய React செயலிகளை உருவாக்கலாம்.

செயல்படுத்தக்கூடிய நுண்ணறிவுகள்:

• உங்கள் மேம்பாட்டு சூழலில் experimental_TracingMarker-உடன் பரிசோதனை செய்யத் தொடங்குங்கள்.
• உங்கள் குறியீட்டின் முக்கியமான பகுதிகளை அடையாளம் காணுங்கள், அவை செயல்திறன் இடையூறுகளாக இருக்கக்கூடும்.
• உங்கள் ட்ரேசிங் மார்க்கர்களுக்கு அர்த்தமுள்ள ID-கள் மற்றும் லேபிள்களைப் பயன்படுத்தவும்.
• React Profiler-ல் ட்ரேசிங் தரவைப் பகுப்பாய்வு செய்யுங்கள்.
• தயாரிப்பு பில்டுகளில் ட்ரேசிங் மார்க்கர்களை அகற்றவும் அல்லது முடக்கவும்.
• சர்வர்-சைட் ட்ரேசிங் மற்றும் பிற செயல்திறன் கண்காணிப்புக் கருவிகளுடன் ட்ரேசிங்கை ஒருங்கிணைப்பதைக் கருத்தில் கொள்ளுங்கள்.