ജാവാസ്ക്രിപ്റ്റ് മൊഡ്യൂൾ ഫെഡറേഷനിൽ വൈദഗ്ദ്ധ്യം നേടാം: ഷെയർഡ് സ്കോപ്പിന്റെയും ഡിപെൻഡൻസി ഷെയറിംഗിന്റെയും ശക്തി

വെബ് ഡെവലപ്‌മെന്റിന്റെ അതിവേഗം വികസിക്കുന്ന ലോകത്ത്, സ്കേലബിളും പരിപാലിക്കാൻ എളുപ്പമുള്ളതുമായ ആപ്ലിക്കേഷനുകൾ നിർമ്മിക്കുന്നതിന് സങ്കീർണ്ണമായ ആർക്കിടെക്ചറൽ പാറ്റേണുകൾ സ്വീകരിക്കേണ്ടിവരുന്നു. ഇവയിൽ, മൈക്രോഫ്രണ്ടെൻഡ് എന്ന ആശയം വലിയ പ്രചാരം നേടിയിട്ടുണ്ട്, ഇത് ടീമുകളെ ഒരു ആപ്ലിക്കേഷന്റെ ഭാഗങ്ങൾ സ്വതന്ത്രമായി വികസിപ്പിക്കാനും വിന്യസിക്കാനും അനുവദിക്കുന്നു. ഈ സ്വതന്ത്ര യൂണിറ്റുകൾക്കിടയിൽ തടസ്സമില്ലാത്ത സംയോജനവും കാര്യക്ഷമമായ കോഡ് പങ്കിടലും സാധ്യമാക്കുന്നതിന്റെ ഹൃദയഭാഗത്ത് വെബ്പാക്കിന്റെ മൊഡ്യൂൾ ഫെഡറേഷൻ പ്ലഗിൻ ഉണ്ട്, അതിന്റെ ശക്തിയുടെ ഒരു പ്രധാന ഘടകമാണ് ഷെയർഡ് സ്കോപ്പ്.

ഈ സമഗ്രമായ ഗൈഡ് ജാവാസ്ക്രിപ്റ്റ് മൊഡ്യൂൾ ഫെഡറേഷനിലെ ഷെയർഡ് സ്കോപ്പ് സംവിധാനത്തിലേക്ക് ആഴത്തിൽ കടന്നുചെല്ലുന്നു. അതെന്താണെന്നും, ഡിപെൻഡൻസി പങ്കിടലിന് അത്യാവശ്യമായിരിക്കുന്നത് എന്തുകൊണ്ടാണെന്നും, അത് എങ്ങനെ പ്രവർത്തിക്കുന്നുവെന്നും, അത് ഫലപ്രദമായി നടപ്പിലാക്കുന്നതിനുള്ള പ്രായോഗിക തന്ത്രങ്ങളും നമ്മൾ പര്യവേക്ഷണം ചെയ്യും. മെച്ചപ്പെട്ട പ്രകടനം, കുറഞ്ഞ ബണ്ടിൽ വലുപ്പങ്ങൾ, ലോകമെമ്പാടുമുള്ള വിവിധ വികസന ടീമുകളിലുടനീളം മെച്ചപ്പെട്ട ഡെവലപ്പർ അനുഭവം എന്നിവയ്ക്കായി ഈ ശക്തമായ ഫീച്ചർ പ്രയോജനപ്പെടുത്താനുള്ള അറിവ് ഡെവലപ്പർമാർക്ക് നൽകുക എന്നതാണ് ഞങ്ങളുടെ ലക്ഷ്യം.

ജാവാസ്ക്രിപ്റ്റ് മൊഡ്യൂൾ ഫെഡറേഷൻ എന്താണ്?

ഷെയർഡ് സ്കോപ്പിലേക്ക് കടക്കുന്നതിന് മുമ്പ്, മൊഡ്യൂൾ ഫെഡറേഷൻ എന്ന അടിസ്ഥാന ആശയം മനസ്സിലാക്കേണ്ടത് അത്യാവശ്യമാണ്. വെബ്പാക്ക് 5-ൽ അവതരിപ്പിച്ച മൊഡ്യൂൾ ഫെഡറേഷൻ, ഒരു ബിൽഡ്-ടൈം, റൺ-ടൈം സൊല്യൂഷനാണ്. ഇത് ജാവാസ്ക്രിപ്റ്റ് ആപ്ലിക്കേഷനുകളെ വെവ്വേറെ കംപൈൽ ചെയ്ത ആപ്ലിക്കേഷനുകൾക്കിടയിൽ കോഡ് (ലൈബ്രറികൾ, ഫ്രെയിംവർക്കുകൾ, അല്ലെങ്കിൽ മുഴുവൻ ഘടകങ്ങൾ പോലും) ഡൈനാമിക്കായി പങ്കിടാൻ അനുവദിക്കുന്നു. ഇതിനർത്ഥം, നിങ്ങൾക്ക് ഒന്നിലധികം വ്യത്യസ്ത ആപ്ലിക്കേഷനുകൾ ('റിമോട്ടുകൾ' അല്ലെങ്കിൽ 'കൺസ്യൂമേഴ്‌സ്' എന്ന് വിളിക്കപ്പെടുന്നു) ഒരു 'കണ്ടെയ്‌നർ' അല്ലെങ്കിൽ 'ഹോസ്റ്റ്' ആപ്ലിക്കേഷനിൽ നിന്ന് കോഡ് ലോഡ് ചെയ്യാൻ കഴിയും, തിരിച്ചും.

മൊഡ്യൂൾ ഫെഡറേഷന്റെ പ്രധാന നേട്ടങ്ങളിൽ ഇവ ഉൾപ്പെടുന്നു:

• കോഡ് ഷെയറിംഗ്: ഒന്നിലധികം ആപ്ലിക്കേഷനുകളിലുടനീളമുള്ള അനാവശ്യ കോഡ് ഒഴിവാക്കുക, മൊത്തത്തിലുള്ള ബണ്ടിൽ വലുപ്പങ്ങൾ കുറയ്ക്കുകയും ലോഡ് സമയം മെച്ചപ്പെടുത്തുകയും ചെയ്യുന്നു.
• സ്വതന്ത്രമായ വിന്യാസം: ടീമുകൾക്ക് ഒരു വലിയ ആപ്ലിക്കേഷന്റെ വിവിധ ഭാഗങ്ങൾ സ്വതന്ത്രമായി വികസിപ്പിക്കാനും വിന്യസിക്കാനും കഴിയും, ഇത് വേഗതയും വേഗത്തിലുള്ള റിലീസ് സൈക്കിളുകളും പ്രോത്സാഹിപ്പിക്കുന്നു.
• ടെക്നോളജി അജ്ഞേയത്വം: പ്രധാനമായും വെബ്പാക്കിനൊപ്പം ഉപയോഗിക്കുന്നുണ്ടെങ്കിലും, ഇത് വിവിധ ബിൽഡ് ടൂളുകളോ ഫ്രെയിംവർക്കുകളോ തമ്മിൽ ഒരു പരിധി വരെ പങ്കിടൽ സുഗമമാക്കുന്നു, ഇത് വഴക്കം പ്രോത്സാഹിപ്പിക്കുന്നു.
• റൺടൈം ഇന്റഗ്രേഷൻ: ആപ്ലിക്കേഷനുകൾ റൺടൈമിൽ കോമ്പോസ് ചെയ്യാൻ കഴിയും, ഇത് ഡൈനാമിക് അപ്‌ഡേറ്റുകൾക്കും ഫ്ലെക്സിബിൾ ആപ്ലിക്കേഷൻ ഘടനകൾക്കും അനുവദിക്കുന്നു.

പ്രശ്നം: മൈക്രോഫ്രണ്ടെൻഡുകളിലെ അനാവശ്യ ഡിപെൻഡൻസികൾ

റിയാക്റ്റ് പോലുള്ള ഒരു ജനപ്രിയ യുഐ ലൈബ്രറിയുടെയോ, റിഡക്സ് പോലുള്ള ഒരു സ്റ്റേറ്റ് മാനേജ്മെൻറ് ലൈബ്രറിയുടെയോ ഒരേ പതിപ്പിനെ ആശ്രയിക്കുന്ന ഒന്നിലധികം മൈക്രോഫ്രണ്ടെൻഡുകൾ നിങ്ങൾക്കുണ്ടെന്ന് കരുതുക. പങ്കുവെക്കുന്നതിനുള്ള ഒരു സംവിധാനമില്ലാതെ, ഓരോ മൈക്രോഫ്രണ്ടെൻഡും ഈ ഡിപെൻഡൻസികളുടെ സ്വന്തം പകർപ്പ് ബണ്ടിൽ ചെയ്യും. ഇത് ഇനിപ്പറയുന്നതിലേക്ക് നയിക്കുന്നു:

• വീർത്ത ബണ്ടിൽ വലുപ്പങ്ങൾ: ഓരോ ആപ്ലിക്കേഷനും പൊതുവായ ലൈബ്രറികൾ അനാവശ്യമായി ആവർത്തിക്കുന്നു, ഇത് ഉപയോക്താക്കൾക്ക് വലിയ ഡൗൺലോഡ് വലുപ്പങ്ങളിലേക്ക് നയിക്കുന്നു.
• മെമ്മറി ഉപഭോഗം വർദ്ധിക്കുന്നു: ബ്രൗസറിൽ ഒരേ ലൈബ്രറിയുടെ ഒന്നിലധികം ഇൻസ്റ്റൻസുകൾ ലോഡ് ചെയ്യുന്നത് കൂടുതൽ മെമ്മറി ഉപയോഗിക്കാൻ കാരണമാകും.
• പൊരുത്തമില്ലാത്ത പെരുമാറ്റം: ആപ്ലിക്കേഷനുകളിലുടനീളമുള്ള പങ്കിട്ട ലൈബ്രറികളുടെ വ്യത്യസ്ത പതിപ്പുകൾ സൂക്ഷ്മമായ ബഗുകൾക്കും അനുയോജ്യത പ്രശ്നങ്ങൾക്കും ഇടയാക്കും.
• നെറ്റ്‌വർക്ക് റിസോഴ്‌സുകളുടെ പാഴാക്കൽ: ഉപയോക്താക്കൾ വ്യത്യസ്ത മൈക്രോഫ്രണ്ടെൻഡുകൾക്കിടയിൽ നാവിഗേറ്റ് ചെയ്യുമ്പോൾ ഒരേ ലൈബ്രറി ഒന്നിലധികം തവണ ഡൗൺലോഡ് ചെയ്തേക്കാം.

ഈ വെല്ലുവിളികൾക്ക് ഒരു മികച്ച പരിഹാരം നൽകിക്കൊണ്ട് മൊഡ്യൂൾ ഫെഡറേഷന്റെ ഷെയർഡ് സ്കോപ്പ് ഇവിടെയാണ് പ്രസക്തമാകുന്നത്.

മൊഡ്യൂൾ ഫെഡറേഷന്റെ ഷെയർഡ് സ്കോപ്പ് മനസ്സിലാക്കുന്നു

ഷെയർഡ് സ്കോപ്പ്, പലപ്പോഴും മൊഡ്യൂൾ ഫെഡറേഷൻ പ്ലഗിനിലെ shared ഓപ്ഷൻ വഴി കോൺഫിഗർ ചെയ്യുന്നത്, സ്വതന്ത്രമായി വിന്യസിച്ച ഒന്നിലധികം ആപ്ലിക്കേഷനുകളെ ഡിപെൻഡൻസികൾ പങ്കിടാൻ പ്രാപ്തമാക്കുന്ന സംവിധാനമാണ്. കോൺഫിഗർ ചെയ്യുമ്പോൾ, മൊഡ്യൂൾ ഫെഡറേഷൻ ഒരു നിർദ്ദിഷ്ട ഡിപെൻഡൻസിയുടെ ഒരൊറ്റ ഇൻസ്റ്റൻസ് ലോഡ് ചെയ്യുകയും അത് ആവശ്യമുള്ള എല്ലാ ആപ്ലിക്കേഷനുകൾക്കും ലഭ്യമാക്കുകയും ചെയ്യുന്നു എന്ന് ഉറപ്പാക്കുന്നു.

അടിസ്ഥാനപരമായി, ഷെയർഡ് സ്കോപ്പ് പ്രവർത്തിക്കുന്നത് പങ്കിട്ട മൊഡ്യൂളുകൾക്കായി ഒരു ഗ്ലോബൽ രജിസ്ട്രി അല്ലെങ്കിൽ കണ്ടെയ്‌നർ സൃഷ്ടിച്ചുകൊണ്ടാണ്. ഒരു ആപ്ലിക്കേഷൻ ഒരു പങ്കിട്ട ഡിപെൻഡൻസി അഭ്യർത്ഥിക്കുമ്പോൾ, മൊഡ്യൂൾ ഫെഡറേഷൻ ഈ രജിസ്ട്രി പരിശോധിക്കുന്നു. ഡിപെൻഡൻസി ഇതിനകം നിലവിലുണ്ടെങ്കിൽ (അതായത്, മറ്റൊരു ആപ്ലിക്കേഷനോ ഹോസ്റ്റോ ലോഡ് ചെയ്തിട്ടുണ്ടെങ്കിൽ), അത് നിലവിലുള്ള ആ ഇൻസ്റ്റൻസ് ഉപയോഗിക്കുന്നു. അല്ലെങ്കിൽ, അത് ഡിപെൻഡൻസി ലോഡ് ചെയ്യുകയും ഭാവിയിലെ ഉപയോഗത്തിനായി ഷെയർഡ് സ്കോപ്പിൽ രജിസ്റ്റർ ചെയ്യുകയും ചെയ്യുന്നു.

കോൺഫിഗറേഷൻ സാധാരണയായി ഇങ്ങനെയായിരിക്കും:

            // webpack.config.js

const { ModuleFederationPlugin } = require('webpack');

module.exports = {
  // ... other webpack configurations
  plugins: [
    new ModuleFederationPlugin({
      name: 'container',
      remotes: {
        'app1': 'app1@http://localhost:3001/remoteEntry.js',
        'app2': 'app2@http://localhost:3002/remoteEntry.js',
      },
      shared: {
        'react': {
          singleton: true,
          eager: true,
          requiredVersion: '^18.0.0',
        },
        'react-dom': {
          singleton: true,
          eager: true,
          requiredVersion: '^18.0.0',
        },
      },
    }),
  ],
};

            

              
                Copy
              
            
          

പങ്കിട്ട ഡിപെൻഡൻസികൾക്കായുള്ള പ്രധാന കോൺഫിഗറേഷൻ ഓപ്ഷനുകൾ:

• singleton: true: ഇത് ഒരുപക്ഷേ ഏറ്റവും നിർണ്ണായകമായ ഓപ്ഷനാണ്. true ആയി സജ്ജീകരിക്കുമ്പോൾ, ഉപയോഗിക്കുന്ന എല്ലാ ആപ്ലിക്കേഷനുകളിലുടനീളവും പങ്കിട്ട ഡിപെൻഡൻസിയുടെ ഒരൊറ്റ ഇൻസ്റ്റൻസ് മാത്രമേ ലോഡ് ചെയ്യപ്പെടുന്നുള്ളൂ എന്ന് ഇത് ഉറപ്പാക്കുന്നു. ഒന്നിലധികം ആപ്ലിക്കേഷനുകൾ ഒരേ സിംഗിൾടൺ ഡിപെൻഡൻസി ലോഡ് ചെയ്യാൻ ശ്രമിക്കുകയാണെങ്കിൽ, മൊഡ്യൂൾ ഫെഡറേഷൻ അവർക്ക് ഒരേ ഇൻസ്റ്റൻസ് നൽകും.
• eager: true: ഡിഫോൾട്ടായി, പങ്കിട്ട ഡിപെൻഡൻസികൾ ലേസിയായി ലോഡ് ചെയ്യപ്പെടുന്നു, അതായത് അവ വ്യക്തമായി ഇംപോർട്ട് ചെയ്യുകയോ ഉപയോഗിക്കുകയോ ചെയ്യുമ്പോൾ മാത്രമേ അവ ലഭ്യമാകൂ. eager: true എന്ന് സജ്ജീകരിക്കുന്നത് ആപ്ലിക്കേഷൻ ആരംഭിക്കുമ്പോൾ തന്നെ ഡിപെൻഡൻസി ലോഡ് ചെയ്യാൻ നിർബന്ധിക്കുന്നു, അത് ഉടൻ ഉപയോഗിക്കുന്നില്ലെങ്കിലും. ഫ്രെയിംവർക്കുകൾ പോലുള്ള നിർണായക ലൈബ്രറികൾ തുടക്കം മുതൽ ലഭ്യമാണെന്ന് ഉറപ്പാക്കാൻ ഇത് പ്രയോജനകരമാണ്.
• requiredVersion: '...': ഈ ഓപ്ഷൻ പങ്കിട്ട ഡിപെൻഡൻസിയുടെ ആവശ്യമായ പതിപ്പ് വ്യക്തമാക്കുന്നു. മൊഡ്യൂൾ ഫെഡറേഷൻ അഭ്യർത്ഥിച്ച പതിപ്പുമായി പൊരുത്തപ്പെടുത്താൻ ശ്രമിക്കും. ഒന്നിലധികം ആപ്ലിക്കേഷനുകൾക്ക് വ്യത്യസ്ത പതിപ്പുകൾ ആവശ്യമാണെങ്കിൽ, ഇത് കൈകാര്യം ചെയ്യാൻ മൊഡ്യൂൾ ഫെഡറേഷന് സംവിധാനങ്ങളുണ്ട് (പിന്നീട് ചർച്ചചെയ്യും).
• version: '...': ഷെയർഡ് സ്കോപ്പിലേക്ക് പ്രസിദ്ധീകരിക്കുന്ന ഡിപെൻഡൻസിയുടെ പതിപ്പ് നിങ്ങൾക്ക് വ്യക്തമായി സജ്ജീകരിക്കാൻ കഴിയും.
• import: false: ഈ ക്രമീകരണം മൊഡ്യൂൾ ഫെഡറേഷനോട് പങ്കിട്ട ഡിപെൻഡൻസി സ്വയമേവ ബണ്ടിൽ ചെയ്യരുതെന്ന് പറയുന്നു. പകരം, അത് ബാഹ്യമായി നൽകുമെന്ന് പ്രതീക്ഷിക്കുന്നു (പങ്കിടുമ്പോൾ ഇത് ഡിഫോൾട്ട് സ്വഭാവമാണ്).
• packageDir: '...': മോണോറെപ്പോകളിൽ ഉപയോഗപ്രദമായ, പങ്കിട്ട ഡിപെൻഡൻസി റിസോൾവ് ചെയ്യേണ്ട പാക്കേജ് ഡയറക്ടറി വ്യക്തമാക്കുന്നു.

ഷെയർഡ് സ്കോപ്പ് എങ്ങനെയാണ് ഡിപെൻഡൻസി ഷെയറിംഗ് സാധ്യമാക്കുന്നത്

ഒരു പ്രായോഗിക ഉദാഹരണം ഉപയോഗിച്ച് നമുക്ക് ഈ പ്രക്രിയയെ വിഭജിക്കാം. നമുക്ക് ഒരു പ്രധാന 'കണ്ടെയ്‌നർ' ആപ്ലിക്കേഷനും, `app1`, `app2` എന്നിങ്ങനെ രണ്ട് 'റിമോട്ട്' ആപ്ലിക്കേഷനുകളും ഉണ്ടെന്ന് സങ്കൽപ്പിക്കുക. ഈ മൂന്ന് ആപ്ലിക്കേഷനുകളും `react`, `react-dom` പതിപ്പ് 18-നെ ആശ്രയിക്കുന്നു.

സാഹചര്യം 1: കണ്ടെയ്‌നർ ആപ്ലിക്കേഷൻ ഡിപെൻഡൻസികൾ പങ്കിടുന്നു

ഈ സാധാരണ സജ്ജീകരണത്തിൽ, കണ്ടെയ്‌നർ ആപ്ലിക്കേഷൻ പങ്കിട്ട ഡിപെൻഡൻസികൾ നിർവചിക്കുന്നു. മൊഡ്യൂൾ ഫെഡറേഷൻ സൃഷ്ടിക്കുന്ന `remoteEntry.js` ഫയൽ ഈ പങ്കിട്ട മൊഡ്യൂളുകളെ എക്സ്പോസ് ചെയ്യുന്നു.

കണ്ടെയ്‌നറിന്റെ വെബ്പാക്ക് കോൺഫിഗറേഷൻ (`container/webpack.config.js`):

            const { ModuleFederationPlugin } = require('webpack');

module.exports = {
  // ...
  plugins: [
    new ModuleFederationPlugin({
      name: 'container',
      filename: 'remoteEntry.js',
      exposes: {
        './App': './src/App',
      },
      shared: {
        'react': {
          singleton: true,
          eager: true,
          requiredVersion: '^18.0.0',
        },
        'react-dom': {
          singleton: true,
          eager: true,
          requiredVersion: '^18.0.0',
        },
      },
    }),
  ],
};

            

              
                Copy
              
            
          

ഇപ്പോൾ, `app1`, `app2` എന്നിവ ഈ പങ്കിട്ട ഡിപെൻഡൻസികൾ ഉപയോഗിക്കും.

`app1`-ന്റെ വെബ്പാക്ക് കോൺഫിഗറേഷൻ (`app1/webpack.config.js`):

            const { ModuleFederationPlugin } = require('webpack');

module.exports = {
  // ...
  plugins: [
    new ModuleFederationPlugin({
      name: 'app1',
      filename: 'remoteEntry.js',
      exposes: {
        './Feature1': './src/Feature1',
      },
      remotes: {
        'container': 'container@http://localhost:3000/remoteEntry.js',
      },
      shared: {
        'react': {
          singleton: true,
          requiredVersion: '^18.0.0',
        },
        'react-dom': {
          singleton: true,
          requiredVersion: '^18.0.0',
        },
      },
    }),
  ],
};

            

              
                Copy
              
            
          

`app2`-ന്റെ വെബ്പാക്ക് കോൺഫിഗറേഷൻ (`app2/webpack.config.js`):

`app2`-ന്റെ കോൺഫിഗറേഷൻ `app1`-ന്റേതിന് സമാനമായിരിക്കും, കൂടാതെ `react`, `react-dom` എന്നിവ ഒരേ പതിപ്പ് ആവശ്യകതകളോടെ പങ്കിട്ടതായി പ്രഖ്യാപിക്കുകയും ചെയ്യും.

റൺടൈമിൽ ഇത് എങ്ങനെ പ്രവർത്തിക്കുന്നു:

1. കണ്ടെയ്‌നർ ആപ്ലിക്കേഷൻ ആദ്യം ലോഡ് ചെയ്യുന്നു, അതിന്റെ പങ്കിട്ട `react`, `react-dom` ഇൻസ്റ്റൻസുകൾ അതിന്റെ മൊഡ്യൂൾ ഫെഡറേഷൻ സ്കോപ്പിൽ ലഭ്യമാക്കുന്നു.
2. `app1` ലോഡ് ചെയ്യുമ്പോൾ, അത് `react`, `react-dom` എന്നിവ അഭ്യർത്ഥിക്കുന്നു. `app1`-ലെ മൊഡ്യൂൾ ഫെഡറേഷൻ ഇവ പങ്കിട്ടതും `singleton: true` ആയി അടയാളപ്പെടുത്തിയതും കാണുന്നു. നിലവിലുള്ള ഇൻസ്റ്റൻസുകൾക്കായി ഇത് ഗ്ലോബൽ സ്കോപ്പ് പരിശോധിക്കുന്നു. കണ്ടെയ്‌നർ ഇതിനകം അവ ലോഡ് ചെയ്തിട്ടുണ്ടെങ്കിൽ, `app1` ആ ഇൻസ്റ്റൻസുകൾ വീണ്ടും ഉപയോഗിക്കുന്നു.
3. അതുപോലെ, `app2` ലോഡ് ചെയ്യുമ്പോഴും, അത് അതേ `react`, `react-dom` ഇൻസ്റ്റൻസുകൾ വീണ്ടും ഉപയോഗിക്കുന്നു.

ഇതിന്റെ ഫലമായി `react`, `react-dom` എന്നിവയുടെ ഒരൊറ്റ പകർപ്പ് മാത്രമേ ബ്രൗസറിൽ ലോഡ് ചെയ്യപ്പെടുന്നുള്ളൂ, ഇത് മൊത്തത്തിലുള്ള ഡൗൺലോഡ് വലുപ്പം ഗണ്യമായി കുറയ്ക്കുന്നു.

സാഹചര്യം 2: റിമോട്ട് ആപ്ലിക്കേഷനുകൾക്കിടയിൽ ഡിപെൻഡൻസികൾ പങ്കിടുന്നു

റിമോട്ട് ആപ്ലിക്കേഷനുകൾക്ക് അവയ്ക്കിടയിലും ഡിപെൻഡൻസികൾ പങ്കിടാൻ മൊഡ്യൂൾ ഫെഡറേഷൻ അനുവദിക്കുന്നു. `app1`-ഉം `app2`-ഉം കണ്ടെയ്‌നർ പങ്കിടാത്ത ഒരു ലൈബ്രറി ഉപയോഗിക്കുകയാണെങ്കിൽ, അവരുടെ കോൺഫിഗറേഷനുകളിൽ അത് പങ്കിട്ടതായി പ്രഖ്യാപിക്കുകയാണെങ്കിൽ അവർക്ക് അത് പങ്കിടാൻ കഴിയും.

ഉദാഹരണം: `app1`-ഉം `app2`-ഉം `lodash` എന്ന യൂട്ടിലിറ്റി ലൈബ്രറി ഉപയോഗിക്കുന്നുവെന്ന് കരുതുക.

`app1`-ന്റെ വെബ്പാക്ക് കോൺഫിഗറേഷൻ (`lodash` ചേർക്കുന്നു):

            
// ... within ModuleFederationPlugin for app1
shared: {
  // ... react, react-dom
  'lodash': {
    singleton: true,
    requiredVersion: '^4.17.21',
  },
},

            

              
                Copy
              
            
          

`app2`-ന്റെ വെബ്പാക്ക് കോൺഫിഗറേഷൻ (`lodash` ചേർക്കുന്നു):

            
// ... within ModuleFederationPlugin for app2
shared: {
  // ... react, react-dom
  'lodash': {
    singleton: true,
    requiredVersion: '^4.17.21',
  },
},

            

              
                Copy
              
            
          

ഈ സാഹചര്യത്തിൽ, കണ്ടെയ്‌നർ `lodash` വ്യക്തമായി പങ്കിടുന്നില്ലെങ്കിലും, `app1`-ഉം `app2`-ഉം ഒരേ ബ്രൗസർ കോൺടെക്സ്റ്റിൽ ലോഡ് ചെയ്യുകയാണെങ്കിൽ, അവർക്കിടയിൽ `lodash`-ന്റെ ഒരൊറ്റ ഇൻസ്റ്റൻസ് പങ്കിടാൻ സാധിക്കും.

പതിപ്പ് പൊരുത്തക്കേടുകൾ കൈകാര്യം ചെയ്യുന്നു

ഡിപെൻഡൻസി പങ്കിടലിലെ ഏറ്റവും സാധാരണമായ വെല്ലുവിളികളിലൊന്ന് പതിപ്പ് അനുയോജ്യതയാണ്. `app1`-ന് `react` v18.1.0-ഉം `app2`-ന് `react` v18.2.0-ഉം ആവശ്യമായി വരുമ്പോൾ എന്ത് സംഭവിക്കും? ഈ സാഹചര്യങ്ങൾ കൈകാര്യം ചെയ്യുന്നതിന് മൊഡ്യൂൾ ഫെഡറേഷൻ ശക്തമായ തന്ത്രങ്ങൾ നൽകുന്നു.

1. കർശനമായ പതിപ്പ് പൊരുത്തപ്പെടുത്തൽ (`requiredVersion`-നുള്ള ഡിഫോൾട്ട് സ്വഭാവം)

നിങ്ങൾ ഒരു കൃത്യമായ പതിപ്പ് (ഉദാഹരണത്തിന്, '18.1.0') അല്ലെങ്കിൽ ഒരു കർശനമായ ശ്രേണി (ഉദാഹരണത്തിന്, '^18.1.0') വ്യക്തമാക്കുമ്പോൾ, മൊഡ്യൂൾ ഫെഡറേഷൻ ഇത് നടപ്പിലാക്കും. ഒരു ആപ്ലിക്കേഷൻ ഇതിനകം ഉപയോഗിക്കുന്ന മറ്റൊരു ആപ്ലിക്കേഷന്റെ ആവശ്യകത തൃപ്തിപ്പെടുത്താത്ത പതിപ്പുള്ള ഒരു പങ്കിട്ട ഡിപെൻഡൻസി ലോഡ് ചെയ്യാൻ ശ്രമിച്ചാൽ, അത് പിശകുകളിലേക്ക് നയിച്ചേക്കാം.

2. പതിപ്പ് ശ്രേണികളും ഫാൾബാക്കുകളും

requiredVersion ഓപ്ഷൻ സെമാന്റിക് പതിപ്പിംഗ് (SemVer) ശ്രേണികളെ പിന്തുണയ്ക്കുന്നു. ഉദാഹരണത്തിന്, '^18.0.0' എന്നാൽ 18.0.0 മുതൽ 19.0.0 വരെ (അതൊഴികെ) ഏത് പതിപ്പും. ഒന്നിലധികം ആപ്ലിക്കേഷനുകൾക്ക് ഈ ശ്രേണിക്കുള്ളിലെ പതിപ്പുകൾ ആവശ്യമാണെങ്കിൽ, മൊഡ്യൂൾ ഫെഡറേഷൻ സാധാരണയായി എല്ലാ ആവശ്യകതകളും തൃപ്തിപ്പെടുത്തുന്ന ഏറ്റവും ഉയർന്ന അനുയോജ്യമായ പതിപ്പ് ഉപയോഗിക്കും.

ഇതൊന്ന് പരിഗണിക്കുക:

• കണ്ടെയ്‌നർ: shared: { 'react': { requiredVersion: '^18.0.0' } }
• `app1`: shared: { 'react': { requiredVersion: '^18.1.0' } }
• `app2`: shared: { 'react': { requiredVersion: '^18.2.0' } }

കണ്ടെയ്‌നർ ആദ്യം ലോഡ് ചെയ്യുകയാണെങ്കിൽ, അത് `react` v18.0.0 (അല്ലെങ്കിൽ അത് യഥാർത്ഥത്തിൽ ബണ്ടിൽ ചെയ്യുന്ന ഏത് പതിപ്പും) സ്ഥാപിക്കുന്നു. `app1` '^18.1.0' ഉപയോഗിച്ച് `react` അഭ്യർത്ഥിക്കുമ്പോൾ, കണ്ടെയ്‌നറിന്റെ പതിപ്പ് 18.1.0-ൽ കുറവാണെങ്കിൽ അത് പരാജയപ്പെട്ടേക്കാം. എന്നിരുന്നാലും, `app1` ആദ്യം ലോഡ് ചെയ്യുകയും `react` v18.1.0 നൽകുകയും, തുടർന്ന് `app2` '^18.2.0' ഉപയോഗിച്ച് `react` അഭ്യർത്ഥിക്കുകയും ചെയ്താൽ, മൊഡ്യൂൾ ഫെഡറേഷൻ `app2`-ന്റെ ആവശ്യകത തൃപ്തിപ്പെടുത്താൻ ശ്രമിക്കും. `react` v18.1.0 ഇൻസ്റ്റൻസ് ഇതിനകം ലോഡ് ചെയ്തിട്ടുണ്ടെങ്കിൽ, v18.1.0 '^18.2.0' തൃപ്തിപ്പെടുത്താത്തതിനാൽ അത് ഒരു പിശക് നൽകിയേക്കാം.

ഇത് ലഘൂകരിക്കുന്നതിന്, സാധാരണയായി കണ്ടെയ്‌നർ ആപ്ലിക്കേഷനിൽ, ഏറ്റവും വിശാലമായ സ്വീകാര്യമായ പതിപ്പ് ശ്രേണി ഉപയോഗിച്ച് പങ്കിട്ട ഡിപെൻഡൻസികൾ നിർവചിക്കുന്നതാണ് നല്ലത്. ഉദാഹരണത്തിന്, '^18.0.0' ഉപയോഗിക്കുന്നത് വഴക്കം നൽകുന്നു. ഒരു നിർദ്ദിഷ്ട റിമോട്ട് ആപ്ലിക്കേഷന് പുതിയ പാച്ച് പതിപ്പിൽ ഹാർഡ് ഡിപെൻഡൻസി ഉണ്ടെങ്കിൽ, അത് ആ പതിപ്പ് വ്യക്തമായി നൽകുന്നതിന് കോൺഫിഗർ ചെയ്യണം.

3. `shareKey`, `shareScope` എന്നിവ ഉപയോഗിക്കുന്നു

ഒരു മൊഡ്യൂൾ പങ്കിടുന്ന കീയും അത് സ്ഥിതിചെയ്യുന്ന സ്കോപ്പും നിയന്ത്രിക്കാൻ മൊഡ്യൂൾ ഫെഡറേഷൻ നിങ്ങളെ അനുവദിക്കുന്നു. ഒരേ ലൈബ്രറിയുടെ വ്യത്യസ്ത പതിപ്പുകൾ വ്യത്യസ്ത കീകളിൻ കീഴിൽ പങ്കിടുന്നതുപോലുള്ള വിപുലമായ സാഹചര്യങ്ങളിൽ ഇത് ഉപയോഗപ്രദമാകും.

4. `strictVersion` ഓപ്ഷൻ

strictVersion പ്രവർത്തനക്ഷമമാകുമ്പോൾ (ഇത് requiredVersion-നുള്ള ഡിഫോൾട്ടാണ്), ഒരു ഡിപെൻഡൻസി തൃപ്തിപ്പെടുത്താൻ കഴിയുന്നില്ലെങ്കിൽ മൊഡ്യൂൾ ഫെഡറേഷൻ ഒരു പിശക് നൽകുന്നു. strictVersion: false എന്ന് സജ്ജീകരിക്കുന്നത് കൂടുതൽ ലളിതമായ പതിപ്പ് കൈകാര്യം ചെയ്യാൻ അനുവദിക്കും, അവിടെ പുതിയത് ലഭ്യമല്ലെങ്കിൽ മൊഡ്യൂൾ ഫെഡറേഷൻ പഴയ പതിപ്പ് ഉപയോഗിക്കാൻ ശ്രമിച്ചേക്കാം, എന്നാൽ ഇത് റൺടൈം പിശകുകളിലേക്ക് നയിച്ചേക്കാം.

ഷെയർഡ് സ്കോപ്പ് ഉപയോഗിക്കുന്നതിനുള്ള മികച്ച രീതികൾ

മൊഡ്യൂൾ ഫെഡറേഷന്റെ ഷെയർഡ് സ്കോപ്പ് ഫലപ്രദമായി ഉപയോഗിക്കുന്നതിനും സാധാരണ പിഴവുകൾ ഒഴിവാക്കുന്നതിനും, ഈ മികച്ച രീതികൾ പരിഗണിക്കുക:

1. പങ്കിട്ട ഡിപെൻഡൻസികൾ കേന്ദ്രീകരിക്കുക: ഫ്രെയിംവർക്കുകൾ (റിയാക്റ്റ്, വ്യൂ, ആംഗുലർ), യുഐ കമ്പോണന്റ് ലൈബ്രറികൾ, സ്റ്റേറ്റ് മാനേജ്മെൻ്റ് ലൈബ്രറികൾ തുടങ്ങിയ പൊതുവായ, സ്ഥിരതയുള്ള ഡിപെൻഡൻസികൾക്കായി ഒരു പ്രാഥമിക ആപ്ലിക്കേഷനെ (പലപ്പോഴും കണ്ടെയ്‌നർ അല്ലെങ്കിൽ ഒരു സമർപ്പിത ഷെയർഡ് ലൈബ്രറി ആപ്ലിക്കേഷൻ) സ്രോതസ്സായി നിശ്ചയിക്കുക.
2. വിശാലമായ പതിപ്പ് ശ്രേണികൾ നിർവചിക്കുക: പ്രാഥമിക പങ്കിടൽ ആപ്ലിക്കേഷനിലെ പങ്കിട്ട ഡിപെൻഡൻസികൾക്കായി SemVer ശ്രേണികൾ (ഉദാഹരണത്തിന്, '^18.0.0') ഉപയോഗിക്കുക. ഇത് മറ്റ് ആപ്ലിക്കേഷനുകളെ മുഴുവൻ ഇക്കോസിസ്റ്റത്തിലും കർശനമായ അപ്‌ഡേറ്റുകൾ നിർബന്ധിക്കാതെ അനുയോജ്യമായ പതിപ്പുകൾ ഉപയോഗിക്കാൻ അനുവദിക്കുന്നു.
3. പങ്കിട്ട ഡിപെൻഡൻസികൾ വ്യക്തമായി രേഖപ്പെടുത്തുക: ഏതൊക്കെ ഡിപെൻഡൻസികളാണ് പങ്കിടുന്നത്, അവയുടെ പതിപ്പുകൾ, ഏതൊക്കെ ആപ്ലിക്കേഷനുകളാണ് അവ പങ്കിടുന്നതിന് ഉത്തരവാദികൾ എന്നതിനെക്കുറിച്ച് വ്യക്തമായ ഡോക്യുമെന്റേഷൻ സൂക്ഷിക്കുക. ഇത് ടീമുകൾക്ക് ഡിപെൻഡൻസി ഗ്രാഫ് മനസ്സിലാക്കാൻ സഹായിക്കുന്നു.
4. ബണ്ടിൽ വലുപ്പങ്ങൾ നിരീക്ഷിക്കുക: നിങ്ങളുടെ ആപ്ലിക്കേഷനുകളുടെ ബണ്ടിൽ വലുപ്പങ്ങൾ പതിവായി വിശകലനം ചെയ്യുക. പൊതുവായ ഡിപെൻഡൻസികൾ ബാഹ്യമാക്കുന്നതിനാൽ മൊഡ്യൂൾ ഫെഡറേഷന്റെ ഷെയർഡ് സ്കോപ്പ് ഡൈനാമിക്കായി ലോഡ് ചെയ്യുന്ന ചങ്കുകളുടെ വലുപ്പം കുറയ്ക്കാൻ സഹായിക്കണം.
5. നിർണ്ണയിക്കാനാവാത്ത ഡിപെൻഡൻസികൾ നിയന്ത്രിക്കുക: പതിവായി അപ്‌ഡേറ്റ് ചെയ്യുന്നതോ അസ്ഥിരമായ API-കളുള്ളതോ ആയ ഡിപെൻഡൻസികളിൽ ശ്രദ്ധിക്കുക. അത്തരം ഡിപെൻഡൻസികൾ പങ്കിടുന്നതിന് കൂടുതൽ ശ്രദ്ധാപൂർവ്വമായ പതിപ്പ് മാനേജ്മെൻ്റും ടെസ്റ്റിംഗും ആവശ്യമായി വന്നേക്കാം.
6. `eager: true` വിവേകത്തോടെ ഉപയോഗിക്കുക: `eager: true` ഒരു ഡിപെൻഡൻസി നേരത്തെ ലോഡ് ചെയ്യപ്പെടുന്നുവെന്ന് ഉറപ്പാക്കുമ്പോൾ, അമിതമായ ഉപയോഗം വലിയ പ്രാരംഭ ലോഡുകളിലേക്ക് നയിച്ചേക്കാം. ആപ്ലിക്കേഷന്റെ സ്റ്റാർട്ടപ്പിന് അത്യാവശ്യമായ നിർണായക ലൈബ്രറികൾക്കായി ഇത് ഉപയോഗിക്കുക.
7. ടെസ്റ്റിംഗ് നിർണായകമാണ്: നിങ്ങളുടെ മൈക്രോഫ്രണ്ടെൻഡുകളുടെ സംയോജനം സമഗ്രമായി പരിശോധിക്കുക. പങ്കിട്ട ഡിപെൻഡൻസികൾ ശരിയായി ലോഡ് ചെയ്തിട്ടുണ്ടെന്നും പതിപ്പ് വൈരുദ്ധ്യങ്ങൾ ഭംഗിയായി കൈകാര്യം ചെയ്യുന്നുവെന്നും ഉറപ്പാക്കുക. ഇൻ്റഗ്രേഷൻ, എൻഡ്-ടു-എൻഡ് ടെസ്റ്റുകൾ ഉൾപ്പെടെയുള്ള ഓട്ടോമേറ്റഡ് ടെസ്റ്റിംഗ് അത്യാവശ്യമാണ്.
8. ലളിതമാക്കാൻ മോണോറെപ്പോകൾ പരിഗണിക്കുക: മൊഡ്യൂൾ ഫെഡറേഷൻ ഉപയോഗിച്ച് തുടങ്ങുന്ന ടീമുകൾക്ക്, ഒരു മോണോറെപ്പോയിൽ (Lerna അല്ലെങ്കിൽ Yarn Workspaces പോലുള്ള ടൂളുകൾ ഉപയോഗിച്ച്) പങ്കിട്ട ഡിപെൻഡൻസികൾ കൈകാര്യം ചെയ്യുന്നത് സജ്ജീകരണം ലളിതമാക്കാനും സ്ഥിരത ഉറപ്പാക്കാനും കഴിയും. `packageDir` ഓപ്ഷൻ ഇവിടെ പ്രത്യേകിച്ചും ഉപയോഗപ്രദമാണ്.
9. `shareKey`, `shareScope` എന്നിവ ഉപയോഗിച്ച് എഡ്ജ് കേസുകൾ കൈകാര്യം ചെയ്യുക: നിങ്ങൾക്ക് സങ്കീർണ്ണമായ പതിപ്പ് സാഹചര്യങ്ങൾ നേരിടുകയോ ഒരേ ലൈബ്രറിയുടെ വ്യത്യസ്ത പതിപ്പുകൾ എക്സ്പോസ് ചെയ്യേണ്ടിവരുകയോ ചെയ്താൽ, കൂടുതൽ സൂക്ഷ്മമായ നിയന്ത്രണത്തിനായി `shareKey`, `shareScope` ഓപ്ഷനുകൾ പര്യവേക്ഷണം ചെയ്യുക.
10. സുരക്ഷാ പരിഗണനകൾ: പങ്കിട്ട ഡിപെൻഡൻസികൾ വിശ്വസനീയമായ ഉറവിടങ്ങളിൽ നിന്ന് ലഭ്യമാക്കുന്നുവെന്ന് ഉറപ്പാക്കുക. നിങ്ങളുടെ ബിൽഡ് പൈപ്പ്ലൈനിനും വിന്യാസ പ്രക്രിയയ്ക്കും സുരക്ഷാ മികച്ച രീതികൾ നടപ്പിലാക്കുക.

ആഗോള സ്വാധീനവും പരിഗണനകളും

ആഗോള വികസന ടീമുകൾക്ക്, മൊഡ്യൂൾ ഫെഡറേഷനും അതിന്റെ ഷെയർഡ് സ്കോപ്പും കാര്യമായ നേട്ടങ്ങൾ നൽകുന്നു:

• മേഖലകളിലുടനീളമുള്ള സ്ഥിരത: ഭൂമിശാസ്ത്രപരമായ സ്ഥാനം പരിഗണിക്കാതെ എല്ലാ ഉപയോക്താക്കൾക്കും ഒരേ കോർ ഡിപെൻഡൻസികളോടെ ആപ്ലിക്കേഷൻ അനുഭവിക്കാൻ കഴിയുമെന്ന് ഉറപ്പാക്കുന്നു, ഇത് പ്രാദേശിക പൊരുത്തക്കേടുകൾ കുറയ്ക്കുന്നു.
• വേഗത്തിലുള്ള ആവർത്തന ചക്രങ്ങൾ: വ്യത്യസ്ത സമയ മേഖലകളിലുള്ള ടീമുകൾക്ക് പൊതുവായ ലൈബ്രറികൾ ആവർത്തിക്കുന്നതിനെക്കുറിച്ചോ ഡിപെൻഡൻസി പതിപ്പുകളെക്കുറിച്ച് പരസ്പരം ആശങ്കപ്പെടാതെ സ്വതന്ത്ര ഫീച്ചറുകളിലോ മൈക്രോഫ്രണ്ടെൻഡുകളിലോ പ്രവർത്തിക്കാൻ കഴിയും.
• വൈവിധ്യമാർന്ന നെറ്റ്‌വർക്കുകൾക്കായി ഒപ്റ്റിമൈസ് ചെയ്തത്: പങ്കിട്ട ഡിപെൻഡൻസികളിലൂടെ മൊത്തത്തിലുള്ള ഡൗൺലോഡ് വലുപ്പം കുറയ്ക്കുന്നത് ലോകത്തിന്റെ പല ഭാഗങ്ങളിലും പ്രചാരത്തിലുള്ള വേഗത കുറഞ്ഞതോ മീറ്റേർഡ് ഇൻ്റർനെറ്റ് കണക്ഷനുകളുള്ളതോ ആയ ഉപയോക്താക്കൾക്ക് പ്രത്യേകിച്ചും പ്രയോജനകരമാണ്.
• ലളിതമായ ഓൺബോർഡിംഗ്: ഒരു വലിയ പ്രോജക്റ്റിൽ ചേരുന്ന പുതിയ ഡെവലപ്പർമാർക്ക് പൊതുവായ ലൈബ്രറികൾ വ്യക്തമായി നിർവചിക്കുകയും പങ്കിടുകയും ചെയ്യുമ്പോൾ ആപ്ലിക്കേഷന്റെ ആർക്കിടെക്ചറും ഡിപെൻഡൻസി മാനേജ്മെൻ്റും എളുപ്പത്തിൽ മനസ്സിലാക്കാൻ കഴിയും.

എന്നിരുന്നാലും, ആഗോള ടീമുകൾ ഇനിപ്പറയുന്ന കാര്യങ്ങളിലും ശ്രദ്ധാലുവായിരിക്കണം:

• CDN തന്ത്രങ്ങൾ: പങ്കിട്ട ഡിപെൻഡൻസികൾ ഒരു CDN-ൽ ഹോസ്റ്റ് ചെയ്യുകയാണെങ്കിൽ, CDN-ന് നല്ല ആഗോള വ്യാപ്തിയും എല്ലാ ടാർഗെറ്റ് പ്രദേശങ്ങൾക്കും കുറഞ്ഞ ലേറ്റൻസിയും ഉണ്ടെന്ന് ഉറപ്പാക്കുക.
• ഓഫ്‌ലൈൻ പിന്തുണ: ഓഫ്‌ലൈൻ കഴിവുകൾ ആവശ്യമുള്ള ആപ്ലിക്കേഷനുകൾക്ക്, പങ്കിട്ട ഡിപെൻഡൻസികളും അവയുടെ കാഷിംഗും കൈകാര്യം ചെയ്യുന്നത് കൂടുതൽ സങ്കീർണ്ണമാകും.
• നിയന്ത്രണപരമായ പാലിക്കൽ: ലൈബ്രറികളുടെ പങ്കിടൽ വിവിധ അധികാരപരിധികളിലെ ഏതെങ്കിലും പ്രസക്തമായ സോഫ്റ്റ്‌വെയർ ലൈസൻസിംഗ് അല്ലെങ്കിൽ ഡാറ്റാ സ്വകാര്യതാ നിയന്ത്രണങ്ങൾ പാലിക്കുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.

സാധാരണ പിഴവുകളും അവ ഒഴിവാക്കുന്നതിനുള്ള വഴികളും

1. തെറ്റായി കോൺഫിഗർ ചെയ്ത `singleton`

പ്രശ്നം: ഒരൊറ്റ ഇൻസ്റ്റൻസ് മാത്രം ഉണ്ടാകേണ്ട ലൈബ്രറികൾക്കായി singleton: true സജ്ജീകരിക്കാൻ മറക്കുന്നു.

പരിഹാരം: നിങ്ങളുടെ ആപ്ലിക്കേഷനുകളിലുടനീളം തനതായി പങ്കിടാൻ ഉദ്ദേശിക്കുന്ന ഫ്രെയിംവർക്കുകൾ, ലൈബ്രറികൾ, യൂട്ടിലിറ്റികൾ എന്നിവയ്ക്കായി എല്ലായ്പ്പോഴും singleton: true സജ്ജമാക്കുക.

2. പൊരുത്തമില്ലാത്ത പതിപ്പ് ആവശ്യകതകൾ

പ്രശ്നം: ഒരേ പങ്കിട്ട ഡിപെൻഡൻസിക്കായി വ്യത്യസ്ത ആപ്ലിക്കേഷനുകൾ വളരെ വ്യത്യസ്തവും പൊരുത്തമില്ലാത്തതുമായ പതിപ്പ് ശ്രേണികൾ വ്യക്തമാക്കുന്നു.

പരിഹാരം: പതിപ്പ് ആവശ്യകതകൾ സ്റ്റാൻഡേർഡ് ചെയ്യുക, പ്രത്യേകിച്ച് കണ്ടെയ്‌നർ ആപ്പിൽ. വിശാലമായ SemVer ശ്രേണികൾ ഉപയോഗിക്കുക, ഏതെങ്കിലും ഒഴിവാക്കലുകൾ രേഖപ്പെടുത്തുക.

3. അപ്രധാനമായ ലൈബ്രറികളുടെ അമിതമായ പങ്കുവെക്കൽ

പ്രശ്നം: ഓരോ ചെറിയ യൂട്ടിലിറ്റി ലൈബ്രറിയും പങ്കിടാൻ ശ്രമിക്കുന്നു, ഇത് സങ്കീർണ്ണമായ കോൺഫിഗറേഷനിലേക്കും സാധ്യതയുള്ള വൈരുദ്ധ്യങ്ങളിലേക്കും നയിക്കുന്നു.

പരിഹാരം: വലുതും പൊതുവായതും സ്ഥിരതയുള്ളതുമായ ഡിപെൻഡൻസികൾ പങ്കിടുന്നതിൽ ശ്രദ്ധ കേന്ദ്രീകരിക്കുക. ചെറുതും അപൂർവ്വമായി ഉപയോഗിക്കുന്നതുമായ യൂട്ടിലിറ്റികൾ സങ്കീർണ്ണത ഒഴിവാക്കാൻ പ്രാദേശികമായി ബണ്ടിൽ ചെയ്യുന്നതാണ് നല്ലത്.

4. `remoteEntry.js` ഫയൽ ശരിയായി കൈകാര്യം ചെയ്യാതിരിക്കുക

പ്രശ്നം: `remoteEntry.js` ഫയൽ ആക്‌സസ് ചെയ്യാൻ കഴിയാതിരിക്കുകയോ അല്ലെങ്കിൽ ഉപയോഗിക്കുന്ന ആപ്ലിക്കേഷനുകൾക്ക് ശരിയായി നൽകാതിരിക്കുകയോ ചെയ്യുക.

പരിഹാരം: റിമോട്ട് എൻട്രികൾക്കായുള്ള നിങ്ങളുടെ ഹോസ്റ്റിംഗ് തന്ത്രം ശക്തമാണെന്നും `remotes` കോൺഫിഗറേഷനിൽ വ്യക്തമാക്കിയ URL-കൾ കൃത്യവും ആക്‌സസ് ചെയ്യാവുന്നതുമാണെന്നും ഉറപ്പാക്കുക.

5. `eager: true`-ന്റെ പ്രത്യാഘാതങ്ങൾ അവഗണിക്കുന്നു

പ്രശ്നം: വളരെയധികം ഡിപെൻഡൻസികളിൽ eager: true സജ്ജീകരിക്കുന്നത്, ഇത് പ്രാരംഭ ലോഡ് സമയം മന്ദഗതിയിലാക്കുന്നു.

പരിഹാരം: നിങ്ങളുടെ ആപ്ലിക്കേഷനുകളുടെ പ്രാരംഭ റെൻഡറിംഗിനോ അല്ലെങ്കിൽ പ്രധാന പ്രവർത്തനത്തിനോ തികച്ചും നിർണായകമായ ഡിപെൻഡൻസികൾക്കായി മാത്രം eager: true ഉപയോഗിക്കുക.

ഉപസംഹാരം

ജാവാസ്ക്രിപ്റ്റ് മൊഡ്യൂൾ ഫെഡറേഷന്റെ ഷെയർഡ് സ്കോപ്പ് ആധുനികവും സ്കേലബിളുമായ വെബ് ആപ്ലിക്കേഷനുകൾ നിർമ്മിക്കുന്നതിനുള്ള ഒരു ശക്തമായ ഉപകരണമാണ്, പ്രത്യേകിച്ച് ഒരു മൈക്രോഫ്രണ്ടെൻഡ് ആർക്കിടെക്ചറിൽ. കാര്യക്ഷമമായ ഡിപെൻഡൻസി പങ്കിടൽ സാധ്യമാക്കുന്നതിലൂടെ, ഇത് കോഡ് ഡ്യൂപ്ലിക്കേഷൻ, ബണ്ടിൽ വലുപ്പം, പൊരുത്തക്കേടുകൾ എന്നിവയുടെ പ്രശ്‌നങ്ങളെ അഭിമുഖീകരിക്കുന്നു, ഇത് മെച്ചപ്പെട്ട പ്രകടനത്തിലേക്കും പരിപാലനത്തിലേക്കും നയിക്കുന്നു. ഈ നേട്ടങ്ങൾ അൺലോക്ക് ചെയ്യുന്നതിനുള്ള താക്കോലാണ് shared ഓപ്ഷൻ, പ്രത്യേകിച്ച് singleton, requiredVersion പ്രോപ്പർട്ടികൾ മനസ്സിലാക്കുകയും ശരിയായി കോൺഫിഗർ ചെയ്യുകയും ചെയ്യുന്നത്.

ആഗോള വികസന ടീമുകൾ മൈക്രോഫ്രണ്ടെൻഡ് തന്ത്രങ്ങൾ കൂടുതലായി സ്വീകരിക്കുന്നതിനാൽ, മൊഡ്യൂൾ ഫെഡറേഷന്റെ ഷെയർഡ് സ്കോപ്പിൽ വൈദഗ്ദ്ധ്യം നേടുന്നത് പരമപ്രധാനമാണ്. മികച്ച രീതികൾ പാലിക്കുന്നതിലൂടെയും, പതിപ്പുകൾ ശ്രദ്ധാപൂർവ്വം കൈകാര്യം ചെയ്യുന്നതിലൂടെയും, സമഗ്രമായ പരിശോധന നടത്തുന്നതിലൂടെയും, വൈവിധ്യമാർന്ന അന്താരാഷ്ട്ര ഉപയോക്തൃ അടിത്തറയെ ഫലപ്രദമായി സേവിക്കുന്ന ശക്തവും ഉയർന്ന പ്രകടനമുള്ളതും പരിപാലിക്കാൻ എളുപ്പമുള്ളതുമായ ആപ്ലിക്കേഷനുകൾ നിർമ്മിക്കാൻ നിങ്ങൾക്ക് ഈ സാങ്കേതികവിദ്യ ഉപയോഗിക്കാം.

ഷെയർഡ് സ്കോപ്പിന്റെ ശക്തി സ്വീകരിക്കുക, നിങ്ങളുടെ ഓർഗനൈസേഷനിലുടനീളം കൂടുതൽ കാര്യക്ഷമവും സഹകരണപരവുമായ വെബ് ഡെവലപ്‌മെന്റിന് വഴിയൊരുക്കുക.