ಬ್ರೌಸರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳು: ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಸರ್ವಿಸ್ ವರ್ಕರ್ ವಲಸೆಯನ್ನು ಅಳವಡಿಸಿಕೊಳ್ಳುವುದು

ಬ್ರೌಸರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಡೆವಲಪ್‌ಮೆಂಟ್‌ನ ಕ್ಷೇತ್ರವು ನಿರಂತರವಾಗಿ ವಿಕಸನಗೊಳ್ಳುತ್ತಿದೆ. ಇತ್ತೀಚಿನ ಪ್ರಮುಖ ಬದಲಾವಣೆಗಳಲ್ಲಿ ಒಂದು, ಸಾಂಪ್ರದಾಯಿಕ ಪರ್ಸಿಸ್ಟೆಂಟ್ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್‌ಗಳಿಂದ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳಿಗಾಗಿ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳಿಗೆ ಬದಲಾಗಿರುವುದು. ಕ್ರೋಮಿಯಂ-ಆಧಾರಿತ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಮ್ಯಾನಿಫೆಸ್ಟ್ V3 (MV3) ನಿಂದ ಪ್ರೇರಿತವಾದ ಈ ವಲಸೆಯು ಹಲವಾರು ಪ್ರಯೋಜನಗಳನ್ನು ತರುತ್ತದೆ, ಆದರೆ ಡೆವಲಪರ್‌ಗಳಿಗೆ ವಿಶಿಷ್ಟ ಸವಾಲುಗಳನ್ನು ಸಹ ಒಡ್ಡುತ್ತದೆ. ಈ ಸಮಗ್ರ ಮಾರ್ಗದರ್ಶಿಯು ಈ ಬದಲಾವಣೆಯ ಹಿಂದಿನ ಕಾರಣಗಳು, ಅನುಕೂಲಗಳು ಮತ್ತು ಅನಾನುಕೂಲಗಳು, ಹಾಗೂ ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ಗೆ ಸುಗಮ ಪರಿವರ್ತನೆಯನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ವಲಸೆ ಪ್ರಕ್ರಿಯೆಯ ವಿವರವಾದ ನಡಾವಳಿಯನ್ನು ವಿವರಿಸುತ್ತದೆ.

ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳಿಗೆ ಏಕೆ ವಲಸೆ ಹೋಗಬೇಕು?

ಈ ಪರಿವರ್ತನೆಯ ಹಿಂದಿನ ಪ್ರಾಥಮಿಕ ಪ್ರೇರಣೆಯು ಬ್ರೌಸರ್ ಕಾರ್ಯಕ್ಷಮತೆ ಮತ್ತು ಸುರಕ್ಷತೆಯನ್ನು ಸುಧಾರಿಸುವುದಾಗಿದೆ. ಮ್ಯಾನಿಫೆಸ್ಟ್ V2 (MV2) ನಲ್ಲಿ ಸಾಮಾನ್ಯವಾಗಿರುವ ಪರ್ಸಿಸ್ಟೆಂಟ್ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್‌ಗಳು, ನಿಷ್ಕ್ರಿಯವಾಗಿದ್ದಾಗಲೂ ಗಮನಾರ್ಹ ಸಂಪನ್ಮೂಲಗಳನ್ನು ಬಳಸಿಕೊಳ್ಳಬಹುದು, ಇದು ಬ್ಯಾಟರಿ ಬಾಳಿಕೆ ಮತ್ತು ಒಟ್ಟಾರೆ ಬ್ರೌಸರ್ ಪ್ರತಿಕ್ರಿಯೆಯ ಮೇಲೆ ಪರಿಣಾಮ ಬೀರುತ್ತದೆ. ಮತ್ತೊಂದೆಡೆ, ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ಈವೆಂಟ್-ಚಾಲಿತವಾಗಿವೆ ಮತ್ತು ಅಗತ್ಯವಿದ್ದಾಗ ಮಾತ್ರ ಸಕ್ರಿಯವಾಗಿರುತ್ತವೆ.

ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳ ಪ್ರಯೋಜನಗಳು:

• ಸುಧಾರಿತ ಕಾರ್ಯಕ್ಷಮತೆ: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ಒಂದು API ಕಾಲ್ ಅಥವಾ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಇನ್ನೊಂದು ಭಾಗದಿಂದ ಸಂದೇಶದಂತಹ ಈವೆಂಟ್ ಪ್ರಚೋದಿಸಿದಾಗ ಮಾತ್ರ ಸಕ್ರಿಯವಾಗಿರುತ್ತವೆ. ಈ "ಈವೆಂಟ್-ಚಾಲಿತ" ಸ್ವಭಾವವು ಸಂಪನ್ಮೂಲ ಬಳಕೆಯನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ ಮತ್ತು ಬ್ರೌಸರ್ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಸುಧಾರಿಸುತ್ತದೆ.
• ವರ್ಧಿತ ಭದ್ರತೆ: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ಹೆಚ್ಚು ನಿರ್ಬಂಧಿತ ಪರಿಸರದಲ್ಲಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತವೆ, ದಾಳಿಯ ಮೇಲ್ಮೈಯನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತವೆ ಮತ್ತು ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಒಟ್ಟಾರೆ ಭದ್ರತೆಯನ್ನು ಸುಧಾರಿಸುತ್ತವೆ.
• ಭವಿಷ್ಯಕ್ಕೆ-ಸಿದ್ಧತೆ: ಹೆಚ್ಚಿನ ಪ್ರಮುಖ ಬ್ರೌಸರ್‌ಗಳು ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ಗಳಲ್ಲಿ ಹಿನ್ನೆಲೆ ಪ್ರಕ್ರಿಯೆಗಾಗಿ ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳನ್ನು ಮಾನದಂಡವಾಗಿ ಅಳವಡಿಸಿಕೊಳ್ಳುತ್ತಿವೆ. ಈಗ ವಲಸೆ ಹೋಗುವುದರಿಂದ ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಹೊಂದಾಣಿಕೆಯಾಗಿರುವುದನ್ನು ಖಚಿತಪಡಿಸುತ್ತದೆ ಮತ್ತು ಭವಿಷ್ಯದ ಬಳಕೆಯಿಂದ ತೆಗೆದುಹಾಕುವಿಕೆಯ ಸಮಸ್ಯೆಗಳನ್ನು ತಪ್ಪಿಸುತ್ತದೆ.
• ತಡೆ-ರಹಿತ ಕಾರ್ಯಾಚರಣೆಗಳು: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ಮುಖ್ಯ ಥ್ರೆಡ್ ಅನ್ನು ನಿರ್ಬಂಧಿಸದೆ ಹಿನ್ನೆಲೆಯಲ್ಲಿ ಕಾರ್ಯಗಳನ್ನು ನಿರ್ವಹಿಸಲು ವಿನ್ಯಾಸಗೊಳಿಸಲಾಗಿದೆ, ಇದು ಸುಗಮ ಬಳಕೆದಾರ ಅನುಭವವನ್ನು ಖಚಿತಪಡಿಸುತ್ತದೆ.

ಅನಾನುಕೂಲಗಳು ಮತ್ತು ಸವಾಲುಗಳು:

• ಕಲಿಕೆಯ ಹಂತ: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ಹೊಸ ಪ್ರೋಗ್ರಾಮಿಂಗ್ ಮಾದರಿಯನ್ನು ಪರಿಚಯಿಸುತ್ತವೆ, ಇದು ಪರ್ಸಿಸ್ಟೆಂಟ್ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್‌ಗಳಿಗೆ ಒಗ್ಗಿಕೊಂಡಿರುವ ಡೆವಲಪರ್‌ಗಳಿಗೆ ಸವಾಲಾಗಬಹುದು. ಈವೆಂಟ್-ಚಾಲಿತ ಸ್ವಭಾವಕ್ಕೆ ಸ್ಥಿತಿ ಮತ್ತು ಸಂವಹನವನ್ನು ನಿರ್ವಹಿಸಲು ವಿಭಿನ್ನ ವಿಧಾನದ ಅಗತ್ಯವಿರುತ್ತದೆ.
• ಸ್ಥಿರ ಸ್ಥಿತಿ ನಿರ್ವಹಣೆ: ಸರ್ವಿಸ್ ವರ್ಕರ್ ಸಕ್ರಿಯಗೊಳಿಸುವಿಕೆಗಳಾದ್ಯಂತ ಸ್ಥಿರ ಸ್ಥಿತಿಯನ್ನು ನಿರ್ವಹಿಸಲು ಎಚ್ಚರಿಕೆಯ ಪರಿಗಣನೆಯ ಅಗತ್ಯವಿರುತ್ತದೆ. ಸ್ಟೋರೇಜ್ API ಅಥವಾ IndexedDB ನಂತಹ ತಂತ್ರಗಳು ನಿರ್ಣಾಯಕವಾಗುತ್ತವೆ.
• ಡೀಬಗ್ ಮಾಡುವ ಸಂಕೀರ್ಣತೆ: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳನ್ನು ಡೀಬಗ್ ಮಾಡುವುದು ಅವುಗಳ ಮಧ್ಯಂತರ ಸ್ವಭಾವದಿಂದಾಗಿ ಸಾಂಪ್ರದಾಯಿಕ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್‌ಗಳನ್ನು ಡೀಬಗ್ ಮಾಡುವುದಕ್ಕಿಂತ ಹೆಚ್ಚು ಸಂಕೀರ್ಣವಾಗಿರುತ್ತದೆ.
• DOM ಗೆ ಸೀಮಿತ ಪ್ರವೇಶ: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ನೇರವಾಗಿ DOM ಅನ್ನು ಪ್ರವೇಶಿಸಲು ಸಾಧ್ಯವಿಲ್ಲ. ವೆಬ್ ಪುಟಗಳೊಂದಿಗೆ ಸಂವಹನ ನಡೆಸಲು ಅವರು ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳೊಂದಿಗೆ ಸಂವಹನ ನಡೆಸಬೇಕು.

ಪ್ರಮುಖ ಪರಿಕಲ್ಪನೆಗಳನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳುವುದು

ವಲಸೆ ಪ್ರಕ್ರಿಯೆಗೆ ಧುಮುಕುವ ಮೊದಲು, ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳ ಹಿಂದಿನ ಮೂಲಭೂತ ಪರಿಕಲ್ಪನೆಗಳನ್ನು ಗ್ರಹಿಸುವುದು ಅತ್ಯಗತ್ಯ:

ಜೀವನಚಕ್ರ ನಿರ್ವಹಣೆ

ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ಈ ಕೆಳಗಿನ ಹಂತಗಳನ್ನು ಒಳಗೊಂಡಿರುವ ವಿಶಿಷ್ಟ ಜೀವನಚಕ್ರವನ್ನು ಹೊಂದಿವೆ:

• ಸ್ಥಾಪನೆ: ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಮೊದಲು ಲೋಡ್ ಮಾಡಿದಾಗ ಅಥವಾ ನವೀಕರಿಸಿದಾಗ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಅನ್ನು ಸ್ಥಾಪಿಸಲಾಗುತ್ತದೆ. ಸ್ಟ್ಯಾಟಿಕ್ ಸ್ವತ್ತುಗಳನ್ನು ಕ್ಯಾಶ್ ಮಾಡಲು ಮತ್ತು ಆರಂಭಿಕ ಸೆಟಪ್ ಕಾರ್ಯಗಳನ್ನು ನಿರ್ವಹಿಸಲು ಇದು ಸೂಕ್ತ ಸಮಯ.
• ಸಕ್ರಿಯಗೊಳಿಸುವಿಕೆ: ಸ್ಥಾಪನೆಯ ನಂತರ, ಸರ್ವಿಸ್ ವರ್ಕರ್ ಅನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಲಾಗುತ್ತದೆ. ಈ ಹಂತದಲ್ಲಿ ಅದು ಈವೆಂಟ್‌ಗಳನ್ನು ನಿರ್ವಹಿಸಲು ಪ್ರಾರಂಭಿಸಬಹುದು.
• ನಿಷ್ಕ್ರಿಯ: ಸರ್ವಿಸ್ ವರ್ಕರ್ ನಿಷ್ಕ್ರಿಯವಾಗಿ ಉಳಿಯುತ್ತದೆ, ಈವೆಂಟ್‌ಗಳು ಅದನ್ನು ಪ್ರಚೋದಿಸಲು ಕಾಯುತ್ತಿರುತ್ತದೆ.
• ಮುಕ್ತಾಯ: ಇನ್ನು ಮುಂದೆ ಅಗತ್ಯವಿಲ್ಲದಿದ್ದಾಗ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಅನ್ನು ಮುಕ್ತಾಯಗೊಳಿಸಲಾಗುತ್ತದೆ.

ಈವೆಂಟ್-ಚಾಲಿತ ಆರ್ಕಿಟೆಕ್ಚರ್

ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ಈವೆಂಟ್-ಚಾಲಿತವಾಗಿವೆ, ಅಂದರೆ ಅವು ನಿರ್ದಿಷ್ಟ ಈವೆಂಟ್‌ಗಳಿಗೆ ಪ್ರತಿಕ್ರಿಯೆಯಾಗಿ ಮಾತ್ರ ಕೋಡ್ ಅನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸುತ್ತವೆ. ಸಾಮಾನ್ಯ ಈವೆಂಟ್‌ಗಳು ಸೇರಿವೆ:

• install: ಸರ್ವಿಸ್ ವರ್ಕರ್ ಸ್ಥಾಪನೆಯಾದಾಗ ಪ್ರಚೋದಿಸಲಾಗುತ್ತದೆ.
• activate: ಸರ್ವಿಸ್ ವರ್ಕರ್ ಸಕ್ರಿಯಗೊಂಡಾಗ ಪ್ರಚೋದಿಸಲಾಗುತ್ತದೆ.
• fetch: ಬ್ರೌಸರ್ ನೆಟ್‌ವರ್ಕ್ ವಿನಂತಿಯನ್ನು ಮಾಡಿದಾಗ ಪ್ರಚೋದಿಸಲಾಗುತ್ತದೆ.
• message: ಸರ್ವಿಸ್ ವರ್ಕರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಇನ್ನೊಂದು ಭಾಗದಿಂದ ಸಂದೇಶವನ್ನು ಸ್ವೀಕರಿಸಿದಾಗ ಪ್ರಚೋದಿಸಲಾಗುತ್ತದೆ.

ಅಂತರ-ಪ್ರಕ್ರಿಯೆ ಸಂವಹನ

ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳಿಗೆ ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳು ಮತ್ತು ಪಾಪ್‌ಅಪ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳಂತಹ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಇತರ ಭಾಗಗಳೊಂದಿಗೆ ಸಂವಹನ ನಡೆಸಲು ಒಂದು ಮಾರ್ಗ ಬೇಕು. ಇದನ್ನು ಸಾಮಾನ್ಯವಾಗಿ chrome.runtime.sendMessage ಮತ್ತು chrome.runtime.onMessage API ಗಳನ್ನು ಬಳಸಿ ಸಾಧಿಸಲಾಗುತ್ತದೆ.

ಹಂತ-ಹಂತದ ವಲಸೆ ಮಾರ್ಗದರ್ಶಿ

ಒಂದು ವಿಶಿಷ್ಟ ಬ್ರೌಸರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಪರ್ಸಿಸ್ಟೆಂಟ್ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್‌ನಿಂದ ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗೆ ವಲಸೆ ಹೋಗುವ ಪ್ರಕ್ರಿಯೆಯನ್ನು ನೋಡೋಣ.

ಹಂತ 1: ನಿಮ್ಮ ಮ್ಯಾನಿಫೆಸ್ಟ್ ಫೈಲ್ (manifest.json) ಅನ್ನು ನವೀಕರಿಸಿ

ಮೊದಲ ಹಂತವೆಂದರೆ ನಿಮ್ಮ manifest.json ಫೈಲ್ ಅನ್ನು ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗೆ ಬದಲಾವಣೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸುವಂತೆ ನವೀಕರಿಸುವುದು. "background" ಫೀಲ್ಡ್ ಅನ್ನು ತೆಗೆದುಹಾಕಿ ಮತ್ತು ಅದನ್ನು "service_worker" ಪ್ರಾಪರ್ಟಿಯನ್ನು ಹೊಂದಿರುವ "background" ಫೀಲ್ಡ್‌ನೊಂದಿಗೆ ಬದಲಾಯಿಸಿ.

ಉದಾಹರಣೆ ಮ್ಯಾನಿಫೆಸ್ಟ್ V2 (ಪರ್ಸಿಸ್ಟೆಂಟ್ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್):

{
  "manifest_version": 2,
  "name": "My Extension",
  "version": "1.0",
  "background": {
    "scripts": ["background.js"],
    "persistent": true
  },
  "permissions": [
    "storage",
    "activeTab"
  ]
}

ಉದಾಹರಣೆ ಮ್ಯಾನಿಫೆಸ್ಟ್ V3 (ಸರ್ವಿಸ್ ವರ್ಕರ್):

{
  "manifest_version": 3,
  "name": "My Extension",
  "version": "1.0",
  "background": {
    "service_worker": "background.js"
  },
  "permissions": [
    "storage",
    "activeTab"
  ]
}

ಪ್ರಮುಖ ಪರಿಗಣನೆಗಳು:

• ನಿಮ್ಮ manifest_version 3 ಗೆ ಹೊಂದಿಸಲಾಗಿದೆಯೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ.
• "service_worker" ಪ್ರಾಪರ್ಟಿ ನಿಮ್ಮ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಸ್ಕ್ರಿಪ್ಟ್‌ನ ಪಥವನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸುತ್ತದೆ.

ಹಂತ 2: ನಿಮ್ಮ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್ (background.js) ಅನ್ನು ಮರುರಚಿಸಿ

ಇದು ವಲಸೆ ಪ್ರಕ್ರಿಯೆಯಲ್ಲಿ ಅತ್ಯಂತ ನಿರ್ಣಾಯಕ ಹಂತವಾಗಿದೆ. ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳ ಈವೆಂಟ್-ಚಾಲಿತ ಸ್ವಭಾವಕ್ಕೆ ಹೊಂದಿಕೊಳ್ಳಲು ನಿಮ್ಮ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ನೀವು ಮರುರಚಿಸಬೇಕಾಗಿದೆ.

1. ಪರ್ಸಿಸ್ಟೆಂಟ್ ಸ್ಟೇಟ್ ವೇರಿಯೇಬಲ್‌ಗಳನ್ನು ತೆಗೆದುಹಾಕಿ

MV2 ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್‌ಗಳಲ್ಲಿ, ವಿಭಿನ್ನ ಈವೆಂಟ್‌ಗಳಾದ್ಯಂತ ಸ್ಥಿತಿಯನ್ನು ನಿರ್ವಹಿಸಲು ನೀವು ಗ್ಲೋಬಲ್ ವೇರಿಯೇಬಲ್‌ಗಳನ್ನು ಅವಲಂಬಿಸಬಹುದಿತ್ತು. ಆದಾಗ್ಯೂ, ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳು ನಿಷ್ಕ್ರಿಯವಾಗಿದ್ದಾಗ ಮುಕ್ತಾಯಗೊಳ್ಳುತ್ತವೆ, ಆದ್ದರಿಂದ ಗ್ಲೋಬಲ್ ವೇರಿಯೇಬಲ್‌ಗಳು ಸ್ಥಿರ ಸ್ಥಿತಿಗೆ ವಿಶ್ವಾಸಾರ್ಹವಲ್ಲ.

ಉದಾಹರಣೆ (MV2):

var counter = 0;

chrome.browserAction.onClicked.addListener(function(tab) {
  counter++;
  console.log("Counter: " + counter);
});

ಪರಿಹಾರ: ಸ್ಟೋರೇಜ್ API ಅಥವಾ IndexedDB ಬಳಸಿ

ಸ್ಟೋರೇಜ್ API (chrome.storage.local ಅಥವಾ chrome.storage.sync) ನಿಮಗೆ ಡೇಟಾವನ್ನು ಸ್ಥಿರವಾಗಿ ಸಂಗ್ರಹಿಸಲು ಮತ್ತು ಹಿಂಪಡೆಯಲು ಅನುಮತಿಸುತ್ತದೆ. ಹೆಚ್ಚು ಸಂಕೀರ್ಣ ಡೇಟಾ ರಚನೆಗಳಿಗಾಗಿ IndexedDB ಮತ್ತೊಂದು ಆಯ್ಕೆಯಾಗಿದೆ.

ಉದಾಹರಣೆ (MV3 ಜೊತೆಗೆ ಸ್ಟೋರೇಜ್ API):

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.storage.local.get(['counter'], function(result) {
    var counter = result.counter || 0;
    counter++;
    chrome.storage.local.set({counter: counter}, function() {
      console.log("Counter: " + counter);
    });
  });
});

ಉದಾಹರಣೆ (MV3 ಜೊತೆಗೆ IndexedDB):

// IndexedDB ಡೇಟಾಬೇಸ್ ತೆರೆಯಲು ಫಂಕ್ಷನ್
function openDatabase() {
  return new Promise((resolve, reject) => {
    const request = indexedDB.open('myDatabase', 1);

    request.onerror = (event) => {
      reject('Error opening database');
    };

    request.onsuccess = (event) => {
      resolve(event.target.result);
    };

    request.onupgradeneeded = (event) => {
      const db = event.target.result;
      db.createObjectStore('myObjectStore', { keyPath: 'id' });
    };
  });
}

// IndexedDB ನಿಂದ ಡೇಟಾ ಪಡೆಯಲು ಫಂಕ್ಷನ್
function getData(db, id) {
  return new Promise((resolve, reject) => {
    const transaction = db.transaction(['myObjectStore'], 'readonly');
    const objectStore = transaction.objectStore('myObjectStore');
    const request = objectStore.get(id);

    request.onerror = (event) => {
      reject('Error getting data');
    };

    request.onsuccess = (event) => {
      resolve(request.result);
    };
  });
}

// IndexedDB ಗೆ ಡೇಟಾ ಹಾಕಲು ಫಂಕ್ಷನ್
function putData(db, data) {
  return new Promise((resolve, reject) => {
    const transaction = db.transaction(['myObjectStore'], 'readwrite');
    const objectStore = transaction.objectStore('myObjectStore');
    const request = objectStore.put(data);

    request.onerror = (event) => {
      reject('Error putting data');
    };

    request.onsuccess = (event) => {
      resolve();
    };
  });
}

chrome.browserAction.onClicked.addListener(async (tab) => {
  try {
    const db = await openDatabase();
    let counterData = await getData(db, 'counter');
    let counter = counterData ? counterData.value : 0;

    counter++;

    await putData(db, { id: 'counter', value: counter });
    db.close();
    console.log("Counter: " + counter);

  } catch (error) {
    console.error("IndexedDB Error: ", error);
  }
});

2. ಈವೆಂಟ್ ಲಿಸನರ್‌ಗಳನ್ನು ಸಂದೇಶ ರವಾನೆಯೊಂದಿಗೆ ಬದಲಾಯಿಸಿ

ನಿಮ್ಮ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್ ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳು ಅಥವಾ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಇತರ ಭಾಗಗಳೊಂದಿಗೆ ಸಂವಹನ ನಡೆಸುತ್ತಿದ್ದರೆ, ನೀವು ಸಂದೇಶ ರವಾನೆಯನ್ನು ಬಳಸಬೇಕಾಗುತ್ತದೆ.

ಉದಾಹರಣೆ (ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್‌ನಿಂದ ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗೆ ಸಂದೇಶ ಕಳುಹಿಸುವುದು):

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    if (request.message === "get_data") {
      // ಡೇಟಾವನ್ನು ಹಿಂಪಡೆಯಲು ಏನಾದರೂ ಮಾಡಿ
      let data = "Example Data";
      sendResponse({data: data});
    }
  }
);

ಉದಾಹರಣೆ (ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ನಿಂದ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗೆ ಸಂದೇಶ ಕಳುಹಿಸುವುದು):

chrome.runtime.sendMessage({message: "get_data"}, function(response) {
  console.log("Received data: " + response.data);
});

3. `install` ಈವೆಂಟ್‌ನಲ್ಲಿ ಆರಂಭಿಕ ಕಾರ್ಯಗಳನ್ನು ನಿರ್ವಹಿಸಿ

ಸರ್ವಿಸ್ ವರ್ಕರ್ ಅನ್ನು ಮೊದಲು ಸ್ಥಾಪಿಸಿದಾಗ ಅಥವಾ ನವೀಕರಿಸಿದಾಗ install ಈವೆಂಟ್ ಪ್ರಚೋದಿಸಲ್ಪಡುತ್ತದೆ. ಡೇಟಾಬೇಸ್‌ಗಳನ್ನು ರಚಿಸುವುದು ಅಥವಾ ಸ್ಟ್ಯಾಟಿಕ್ ಸ್ವತ್ತುಗಳನ್ನು ಕ್ಯಾಶ್ ಮಾಡುವಂತಹ ಆರಂಭಿಕ ಕಾರ್ಯಗಳನ್ನು ನಿರ್ವಹಿಸಲು ಇದು ಸೂಕ್ತ ಸ್ಥಳವಾಗಿದೆ.

ಉದಾಹರಣೆ:

chrome.runtime.onInstalled.addListener(function() {
  console.log("Service Worker installed.");
  // ಆರಂಭಿಕ ಕಾರ್ಯಗಳನ್ನು ಇಲ್ಲಿ ನಿರ್ವಹಿಸಿ
  chrome.storage.local.set({initialized: true});
});

4. ಆಫ್‌ಸ್ಕ್ರೀನ್ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳನ್ನು ಪರಿಗಣಿಸಿ

ಮ್ಯಾನಿಫೆಸ್ಟ್ V3, ಆಡಿಯೋ ಪ್ಲೇಬ್ಯಾಕ್ ಅಥವಾ ಕ್ಲಿಪ್‌ಬೋರ್ಡ್ ಸಂವಹನದಂತಹ, ಹಿಂದೆ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಪೇಜ್‌ಗಳಲ್ಲಿ DOM ಪ್ರವೇಶದ ಅಗತ್ಯವಿರುವ ಕಾರ್ಯಗಳನ್ನು ನಿರ್ವಹಿಸಲು ಆಫ್‌ಸ್ಕ್ರೀನ್ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳನ್ನು ಪರಿಚಯಿಸಿದೆ. ಈ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳು ಪ್ರತ್ಯೇಕ ಸಂದರ್ಭದಲ್ಲಿ ಚಲಿಸುತ್ತವೆ ಆದರೆ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಪರವಾಗಿ DOM ನೊಂದಿಗೆ ಸಂವಹನ ನಡೆಸಬಹುದು.

ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ DOM ಅನ್ನು ವ್ಯಾಪಕವಾಗಿ ನಿರ್ವಹಿಸಬೇಕಾದರೆ ಅಥವಾ ಸಂದೇಶ ರವಾನೆ ಮತ್ತು ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳೊಂದಿಗೆ ಸುಲಭವಾಗಿ ಸಾಧಿಸಲಾಗದ ಕಾರ್ಯಗಳನ್ನು ನಿರ್ವಹಿಸಬೇಕಾದರೆ, ಆಫ್‌ಸ್ಕ್ರೀನ್ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳು ಸರಿಯಾದ ಪರಿಹಾರವಾಗಿರಬಹುದು.

ಉದಾಹರಣೆ (ಆಫ್‌ಸ್ಕ್ರೀನ್ ಡಾಕ್ಯುಮೆಂಟ್ ರಚಿಸುವುದು):

// ನಿಮ್ಮ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್‌ನಲ್ಲಿ:
async function createOffscreen() {
  if (await chrome.offscreen.hasDocument({
    reasons: [chrome.offscreen.Reason.WORKER],
    justification: 'reason for needing the document'
  })) {
    return;
  }
  await chrome.offscreen.createDocument({
    url: 'offscreen.html',
    reasons: [chrome.offscreen.Reason.WORKER],
    justification: 'reason for needing the document'
  });
}

chrome.runtime.onStartup.addListener(createOffscreen);
chrome.runtime.onInstalled.addListener(createOffscreen);

ಉದಾಹರಣೆ (offscreen.html):

ಉದಾಹರಣೆ (offscreen.js, ಇದು ಆಫ್‌ಸ್ಕ್ರೀನ್ ಡಾಕ್ಯುಮೆಂಟ್‌ನಲ್ಲಿ ಚಲಿಸುತ್ತದೆ):

// ಸರ್ವಿಸ್ ವರ್ಕರ್‌ನಿಂದ ಸಂದೇಶಗಳನ್ನು ಆಲಿಸಿ
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === 'doSomething') {
    // ಇಲ್ಲಿ DOM ನೊಂದಿಗೆ ಏನಾದರೂ ಮಾಡಿ
    document.body.textContent = 'Action performed!';
    sendResponse({ result: 'success' });
  }
});

ಹಂತ 3: ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ಪರೀಕ್ಷಿಸಿ

ನಿಮ್ಮ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಮರುರಚಿಸಿದ ನಂತರ, ಹೊಸ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಪರಿಸರದಲ್ಲಿ ಅದು ಸರಿಯಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತಿದೆಯೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ಪರೀಕ್ಷಿಸುವುದು ನಿರ್ಣಾಯಕವಾಗಿದೆ. ಈ ಕೆಳಗಿನ ಕ್ಷೇತ್ರಗಳ ಬಗ್ಗೆ ವಿಶೇಷ ಗಮನ ಕೊಡಿ:

• ಸ್ಥಿತಿ ನಿರ್ವಹಣೆ: ನಿಮ್ಮ ಸ್ಥಿರ ಸ್ಥಿತಿಯು ಸ್ಟೋರೇಜ್ API ಅಥವಾ IndexedDB ಬಳಸಿ ಸರಿಯಾಗಿ ಸಂಗ್ರಹಿಸಲ್ಪಡುತ್ತಿದೆಯೇ ಮತ್ತು ಹಿಂಪಡೆಯಲಾಗುತ್ತಿದೆಯೇ ಎಂದು ಪರಿಶೀಲಿಸಿ.
• ಸಂದೇಶ ರವಾನೆ: ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್, ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳು ಮತ್ತು ಪಾಪ್‌ಅಪ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳ ನಡುವೆ ಸಂದೇಶಗಳು ಸರಿಯಾಗಿ ಕಳುಹಿಸಲ್ಪಡುತ್ತಿವೆಯೇ ಮತ್ತು ಸ್ವೀಕರಿಸಲ್ಪಡುತ್ತಿವೆಯೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ.
• ಈವೆಂಟ್ ನಿರ್ವಹಣೆ: ಎಲ್ಲಾ ಈವೆಂಟ್ ಲಿಸನರ್‌ಗಳನ್ನು ನಿರೀಕ್ಷೆಯಂತೆ ಪ್ರಚೋದಿಸಲಾಗಿದೆಯೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಪರೀಕ್ಷಿಸಿ.
• ಕಾರ್ಯಕ್ಷಮತೆ: ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅತಿಯಾದ ಸಂಪನ್ಮೂಲಗಳನ್ನು ಬಳಸುತ್ತಿಲ್ಲ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಅದರ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಮೇಲ್ವಿಚಾರಣೆ ಮಾಡಿ.

ಹಂತ 4: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳನ್ನು ಡೀಬಗ್ ಮಾಡುವುದು

ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳನ್ನು ಅವುಗಳ ಮಧ್ಯಂತರ ಸ್ವಭಾವದಿಂದಾಗಿ ಡೀಬಗ್ ಮಾಡುವುದು ಸವಾಲಿನದ್ದಾಗಿರಬಹುದು. ನಿಮ್ಮ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಅನ್ನು ಡೀಬಗ್ ಮಾಡಲು ನಿಮಗೆ ಸಹಾಯ ಮಾಡಲು ಕೆಲವು ಸಲಹೆಗಳು ಇಲ್ಲಿವೆ:

• Chrome DevTools: ಸರ್ವಿಸ್ ವರ್ಕರ್ ಅನ್ನು ಪರೀಕ್ಷಿಸಲು, ಕನ್ಸೋಲ್ ಲಾಗ್‌ಗಳನ್ನು ವೀಕ್ಷಿಸಲು ಮತ್ತು ಬ್ರೇಕ್‌ಪಾಯಿಂಟ್‌ಗಳನ್ನು ಹೊಂದಿಸಲು Chrome DevTools ಬಳಸಿ. ನೀವು ಸರ್ವಿಸ್ ವರ್ಕರ್ ಅನ್ನು "Application" ಟ್ಯಾಬ್ ಅಡಿಯಲ್ಲಿ ಕಾಣಬಹುದು.
• ಸ್ಥಿರ ಕನ್ಸೋಲ್ ಲಾಗ್‌ಗಳು: ನಿಮ್ಮ ಸರ್ವಿಸ್ ವರ್ಕರ್‌ನ ಕಾರ್ಯಗತಗೊಳಿಸುವಿಕೆಯ ಹರಿವನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು console.log ಹೇಳಿಕೆಗಳನ್ನು ಉದಾರವಾಗಿ ಬಳಸಿ.
• ಬ್ರೇಕ್‌ಪಾಯಿಂಟ್‌ಗಳು: ಕಾರ್ಯಗತಗೊಳಿಸುವಿಕೆಯನ್ನು ವಿರಾಮಗೊಳಿಸಲು ಮತ್ತು ವೇರಿಯೇಬಲ್‌ಗಳನ್ನು ಪರೀಕ್ಷಿಸಲು ನಿಮ್ಮ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಕೋಡ್‌ನಲ್ಲಿ ಬ್ರೇಕ್‌ಪಾಯಿಂಟ್‌ಗಳನ್ನು ಹೊಂದಿಸಿ.
• ಸರ್ವಿಸ್ ವರ್ಕರ್ ಇನ್ಸ್‌ಪೆಕ್ಟರ್: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ನ ಸ್ಥಿತಿ, ಈವೆಂಟ್‌ಗಳು ಮತ್ತು ನೆಟ್‌ವರ್ಕ್ ವಿನಂತಿಗಳನ್ನು ವೀಕ್ಷಿಸಲು Chrome DevTools ನಲ್ಲಿ ಸರ್ವಿಸ್ ವರ್ಕರ್ ಇನ್ಸ್‌ಪೆಕ್ಟರ್ ಅನ್ನು ಬಳಸಿ.

ಸರ್ವಿಸ್ ವರ್ಕರ್ ವಲಸೆಗಾಗಿ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳು

ನಿಮ್ಮ ಬ್ರೌಸರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳಿಗೆ ವಲಸೆ ಹೋಗುವಾಗ ಅನುಸರಿಸಬೇಕಾದ ಕೆಲವು ಉತ್ತಮ ಅಭ್ಯಾಸಗಳು ಇಲ್ಲಿವೆ:

• ಬೇಗನೆ ಪ್ರಾರಂಭಿಸಿ: ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳಿಗೆ ವಲಸೆ ಹೋಗಲು ಕೊನೆಯ ಕ್ಷಣದವರೆಗೆ ಕಾಯಬೇಡಿ. ನಿಮ್ಮ ಕೋಡ್ ಅನ್ನು ಮರುರಚಿಸಲು ಮತ್ತು ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಪರೀಕ್ಷಿಸಲು ನಿಮಗೆ ಸಾಕಷ್ಟು ಸಮಯವನ್ನು ನೀಡಲು ಸಾಧ್ಯವಾದಷ್ಟು ಬೇಗ ವಲಸೆ ಪ್ರಕ್ರಿಯೆಯನ್ನು ಪ್ರಾರಂಭಿಸಿ.
• ಕಾರ್ಯವನ್ನು ವಿಭಜಿಸಿ: ವಲಸೆ ಪ್ರಕ್ರಿಯೆಯನ್ನು ಸಣ್ಣ, ನಿರ್ವಹಿಸಬಹುದಾದ ಕಾರ್ಯಗಳಾಗಿ ವಿಭಜಿಸಿ. ಇದು ಪ್ರಕ್ರಿಯೆಯನ್ನು ಕಡಿಮೆ ಬೆದರಿಸುವ ಮತ್ತು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಸುಲಭವಾಗಿಸುತ್ತದೆ.
• ಆಗಾಗ್ಗೆ ಪರೀಕ್ಷಿಸಿ: ದೋಷಗಳನ್ನು ಮೊದಲೇ ಹಿಡಿಯಲು ವಲಸೆ ಪ್ರಕ್ರಿಯೆಯ ಉದ್ದಕ್ಕೂ ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಆಗಾಗ್ಗೆ ಪರೀಕ್ಷಿಸಿ.
• ಸ್ಥಿರ ಸ್ಥಿತಿಗಾಗಿ ಸ್ಟೋರೇಜ್ API ಅಥವಾ IndexedDB ಬಳಸಿ: ಸ್ಥಿರ ಸ್ಥಿತಿಗಾಗಿ ಗ್ಲೋಬಲ್ ವೇರಿಯೇಬಲ್‌ಗಳನ್ನು ಅವಲಂಬಿಸಬೇಡಿ. ಬದಲಿಗೆ ಸ್ಟೋರೇಜ್ API ಅಥವಾ IndexedDB ಬಳಸಿ.
• ಸಂವಹನಕ್ಕಾಗಿ ಸಂದೇಶ ರವಾನೆಯನ್ನು ಬಳಸಿ: ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್, ಕಂಟೆಂಟ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳು ಮತ್ತು ಪಾಪ್‌ಅಪ್ ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳ ನಡುವೆ ಸಂವಹನ ನಡೆಸಲು ಸಂದೇಶ ರವಾನೆಯನ್ನು ಬಳಸಿ.
• ನಿಮ್ಮ ಕೋಡ್ ಅನ್ನು ಆಪ್ಟಿಮೈಜ್ ಮಾಡಿ: ಸಂಪನ್ಮೂಲ ಬಳಕೆಯನ್ನು ಕಡಿಮೆ ಮಾಡಲು ಕಾರ್ಯಕ್ಷಮತೆಗಾಗಿ ನಿಮ್ಮ ಕೋಡ್ ಅನ್ನು ಆಪ್ಟಿಮೈಜ್ ಮಾಡಿ.
• ಆಫ್‌ಸ್ಕ್ರೀನ್ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳನ್ನು ಪರಿಗಣಿಸಿ: ನೀವು DOM ಅನ್ನು ವ್ಯಾಪಕವಾಗಿ ನಿರ್ವಹಿಸಬೇಕಾದರೆ, ಆಫ್‌ಸ್ಕ್ರೀನ್ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳನ್ನು ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ.

ಅಂತರರಾಷ್ಟ್ರೀಕರಣದ ಪರಿಗಣನೆಗಳು

ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರಿಗಾಗಿ ಬ್ರೌಸರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ಗಳನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸುವಾಗ, ಅಂತರರಾಷ್ಟ್ರೀಕರಣ (i18n) ಮತ್ತು ಸ್ಥಳೀಕರಣವನ್ನು (l10n) ಪರಿಗಣಿಸುವುದು ನಿರ್ಣಾಯಕವಾಗಿದೆ. ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ವಿಶ್ವಾದ್ಯಂತ ಬಳಕೆದಾರರಿಗೆ ಪ್ರವೇಶಿಸಬಹುದೆಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಕೆಲವು ಸಲಹೆಗಳು ಇಲ್ಲಿವೆ:

• `_locales` ಫೋಲ್ಡರ್ ಬಳಸಿ: ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಅನುವಾದಿತ ಸ್ಟ್ರಿಂಗ್‌ಗಳನ್ನು _locales ಫೋಲ್ಡರ್‌ನಲ್ಲಿ ಸಂಗ್ರಹಿಸಿ. ಈ ಫೋಲ್ಡರ್ ಪ್ರತಿ ಬೆಂಬಲಿತ ಭಾಷೆಗೆ ಉಪ-ಫೋಲ್ಡರ್‌ಗಳನ್ನು ಹೊಂದಿರುತ್ತದೆ, ಅನುವಾದಗಳನ್ನು ಹೊಂದಿರುವ messages.json ಫೈಲ್‌ನೊಂದಿಗೆ.
• `__MSG_messageName__` ಸಿಂಟ್ಯಾಕ್ಸ್ ಬಳಸಿ: ನಿಮ್ಮ ಕೋಡ್ ಮತ್ತು ಮ್ಯಾನಿಫೆಸ್ಟ್ ಫೈಲ್‌ನಲ್ಲಿ ನಿಮ್ಮ ಅನುವಾದಿತ ಸ್ಟ್ರಿಂಗ್‌ಗಳನ್ನು ಉಲ್ಲೇಖಿಸಲು __MSG_messageName__ ಸಿಂಟ್ಯಾಕ್ಸ್ ಬಳಸಿ.
• ಬಲದಿಂದ-ಎಡಕ್ಕೆ (RTL) ಭಾಷೆಗಳನ್ನು ಬೆಂಬಲಿಸಿ: ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಲೇಔಟ್ ಮತ್ತು ಸ್ಟೈಲಿಂಗ್ ಅರೇಬಿಕ್ ಮತ್ತು ಹೀಬ್ರೂನಂತಹ RTL ಭಾಷೆಗಳಿಗೆ ಸರಿಯಾಗಿ ಹೊಂದಿಕೊಳ್ಳುತ್ತದೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ.
• ದಿನಾಂಕ ಮತ್ತು ಸಮಯದ ಫಾರ್ಮ್ಯಾಟಿಂಗ್ ಅನ್ನು ಪರಿಗಣಿಸಿ: ಪ್ರತಿ ಲೊಕೇಲ್‌ಗೆ ಸೂಕ್ತವಾದ ದಿನಾಂಕ ಮತ್ತು ಸಮಯದ ಫಾರ್ಮ್ಯಾಟಿಂಗ್ ಅನ್ನು ಬಳಸಿ.
• ಸಾಂಸ್ಕೃತಿಕವಾಗಿ ಸಂಬಂಧಿತ ವಿಷಯವನ್ನು ಒದಗಿಸಿ: ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ವಿಷಯವನ್ನು ವಿವಿಧ ಪ್ರದೇಶಗಳಿಗೆ ಸಾಂಸ್ಕೃತಿಕವಾಗಿ ಸಂಬಂಧಿತವಾಗುವಂತೆ ಹೊಂದಿಸಿ.

ಉದಾಹರಣೆ (_locales/en/messages.json):

{
  "extensionName": {
    "message": "My Extension",
    "description": "The name of the extension"
  },
  "buttonText": {
    "message": "Click Me",
    "description": "The text for the button"
  }
}

ಉದಾಹರಣೆ (ನಿಮ್ಮ ಕೋಡ್‌ನಲ್ಲಿ ಅನುವಾದಿತ ಸ್ಟ್ರಿಂಗ್‌ಗಳನ್ನು ಉಲ್ಲೇಖಿಸುವುದು):

document.getElementById('myButton').textContent = chrome.i18n.getMessage("buttonText");

ತೀರ್ಮಾನ

ನಿಮ್ಮ ಬ್ರೌಸರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್‌ನ ಬ್ಯಾಕ್‌ಗ್ರೌಂಡ್ ಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗೆ ವಲಸೆ ಹೋಗುವುದು ಕಾರ್ಯಕ್ಷಮತೆ, ಭದ್ರತೆಯನ್ನು ಸುಧಾರಿಸಲು ಮತ್ತು ನಿಮ್ಮ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅನ್ನು ಭವಿಷ್ಯಕ್ಕೆ-ಸಿದ್ಧಗೊಳಿಸಲು ಒಂದು ಮಹತ್ವದ ಹೆಜ್ಜೆಯಾಗಿದೆ. ಈ ಪರಿವರ್ತನೆಯು ಕೆಲವು ಸವಾಲುಗಳನ್ನು ಒಡ್ಡಬಹುದಾದರೂ, ಪ್ರಯೋಜನಗಳು ಪ್ರಯತ್ನಕ್ಕೆ ಯೋಗ್ಯವಾಗಿವೆ. ಈ ಮಾರ್ಗದರ್ಶಿಯಲ್ಲಿ ವಿವರಿಸಲಾದ ಹಂತಗಳನ್ನು ಅನುಸರಿಸುವ ಮೂಲಕ ಮತ್ತು ಉತ್ತಮ ಅಭ್ಯಾಸಗಳನ್ನು ಅಳವಡಿಸಿಕೊಳ್ಳುವ ಮೂಲಕ, ನೀವು ಸುಗಮ ಮತ್ತು ಯಶಸ್ವಿ ವಲಸೆಯನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಬಹುದು, ನಿಮ್ಮ ವಿಶ್ವಾದ್ಯಂತದ ಬಳಕೆದಾರರಿಗೆ ಉತ್ತಮ ಅನುಭವವನ್ನು ನೀಡಬಹುದು. ಸರ್ವಿಸ್ ವರ್ಕರ್‌ಗಳ ಶಕ್ತಿಯನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ಬಳಸಿಕೊಳ್ಳಲು ಸಂಪೂರ್ಣವಾಗಿ ಪರೀಕ್ಷಿಸಲು ಮತ್ತು ಹೊಸ ಈವೆಂಟ್-ಚಾಲಿತ ಆರ್ಕಿಟೆಕ್ಚರ್‌ಗೆ ಹೊಂದಿಕೊಳ್ಳಲು ಮರೆಯದಿರಿ.

ಹೆಚ್ಚುವರಿ ಸಂಪನ್ಮೂಲಗಳು

• Chrome Extension Manifest V3 Documentation
• Mozilla Service Worker API Documentation
• Service Worker Fundamentals