ಸುಮಾರು 15 ವರ್ಷಗಳ ಹಿಂದೆ, ನಾನು ಟ್ರಾವೆಲ್ ಏಜೆಂಟ್‌ಗಳು, ಏರ್‌ಪೋರ್ಟ್ ಕೆಲಸಗಾರರು ಮತ್ತು ಏರ್‌ಲೈನ್ ಕಂಪನಿಗಳಿಗೆ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ನಿರ್ಮಿಸಿದ ಕಂಪನಿಯಲ್ಲಿ ಕೆಲಸ ಮಾಡುತ್ತಿದ್ದೆ. UI ಘಟಕಗಳು ಮತ್ತು ಏಕ-ಪುಟ ಅಪ್ಲಿಕೇಶನ್ ಸಾಮರ್ಥ್ಯಗಳಿಗಾಗಿ ನಾವು ನಮ್ಮದೇ ಆದ ಆಂತರಿಕ ಚೌಕಟ್ಟನ್ನು ನಿರ್ಮಿಸಿದ್ದೇವೆ. ನಾವು ಪ್ರತಿಯೊಂದಕ್ಕೂ ಘಟಕಗಳನ್ನು ಹೊಂದಿದ್ದೇವೆ: ಕ್ಷೇತ್ರಗಳು, ಬಟನ್‌ಗಳು, ಟ್ಯಾಬ್‌ಗಳು, ಶ್ರೇಣಿಗಳು, ಡೇಟಾಟೇಬಲ್‌ಗಳು, ಮೆನುಗಳು, ಡೇಟ್‌ಪಿಕರ್‌ಗಳು, ಆಯ್ಕೆಗಳು ಮತ್ತು ಬಹುಆಯ್ಕೆಗಳು. ನಾವು DIV ಘಟಕವನ್ನು ಸಹ ಹೊಂದಿದ್ದೇವೆ. ನಮ್ಮ DIV ಘಟಕವು ಉತ್ತಮವಾಗಿದೆ, ಇದು ನಮಗೆ ಎಲ್ಲಾ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ದುಂಡಾದ ಮೂಲೆಗಳನ್ನು ಮಾಡಲು ಅವಕಾಶ ಮಾಡಿಕೊಟ್ಟಿತು, ಅದನ್ನು ನಂಬಿ ಅಥವಾ ಇಲ್ಲ, ಆ ಸಮಯದಲ್ಲಿ ಮಾಡುವುದು ಸುಲಭದ ಕೆಲಸವಾಗಿರಲಿಲ್ಲ.

JS, Ajax ಮತ್ತು ಡೈನಾಮಿಕ್ ಎಚ್ಟಿಎಮ್ಎಲ್ಗಳು ನಮ್ಮನ್ನು ಭವಿಷ್ಯಕ್ಕೆ ತಂದ ಕ್ರಾಂತಿಯಾಗಿ ನೋಡಿದಾಗ ನಮ್ಮ ಇತಿಹಾಸದ ಒಂದು ಹಂತದಲ್ಲಿ ನಮ್ಮ ಕೆಲಸವು ನಡೆಯಿತು. ಇದ್ದಕ್ಕಿದ್ದಂತೆ, ನಾವು ಪುಟವನ್ನು ಕ್ರಿಯಾತ್ಮಕವಾಗಿ ನವೀಕರಿಸಬಹುದು, ಸರ್ವರ್‌ನಿಂದ ಡೇಟಾವನ್ನು ಪಡೆದುಕೊಳ್ಳಬಹುದು ಮತ್ತು ಇತರ ಪುಟಗಳಿಗೆ ನ್ಯಾವಿಗೇಟ್ ಮಾಡುವುದನ್ನು ತಪ್ಪಿಸಬಹುದು, ಅದು ನಿಧಾನವಾಗಿ ಕಂಡುಬರುತ್ತದೆ ಮತ್ತು ಎರಡು ಪುಟಗಳ ನಡುವೆ ಪರದೆಯ ಮೇಲೆ ದೊಡ್ಡ ಬಿಳಿ ಆಯತವನ್ನು ಹೊಳೆಯಿತು. ಜೆಫ್ ಅಟ್‌ವುಡ್ (ಸ್ಟಾಕ್‌ಓವರ್‌ಫ್ಲೋ ಸಂಸ್ಥಾಪಕರು) ಜನಪ್ರಿಯಗೊಳಿಸಿದ ಒಂದು ನುಡಿಗಟ್ಟು ಇತ್ತು: "ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ನಲ್ಲಿ ಬರೆಯಬಹುದಾದ ಯಾವುದೇ ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ಅಂತಿಮವಾಗಿ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ನಲ್ಲಿ ಬರೆಯಲಾಗುತ್ತದೆ." - ಜೆಫ್ ಅಟ್ವುಡ್

ಆ ಸಮಯದಲ್ಲಿ ನಮಗೆ, ಇದು ನಿಜವಾಗಿ ಹೋಗಿ ಆ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ರಚಿಸಲು ಧೈರ್ಯದಂತೆ ಭಾಸವಾಯಿತು. JS ನೊಂದಿಗೆ ಎಲ್ಲವನ್ನೂ ಮಾಡಲು ಇದು ಕಂಬಳಿ ಅನುಮೋದನೆಯಂತೆ ಭಾಸವಾಯಿತು. ಆದ್ದರಿಂದ ನಾವು JS ನೊಂದಿಗೆ ಎಲ್ಲವನ್ನೂ ಮಾಡಿದ್ದೇವೆ ಮತ್ತು ಕೆಲಸ ಮಾಡುವ ಇತರ ವಿಧಾನಗಳನ್ನು ಸಂಶೋಧಿಸಲು ನಾವು ನಿಜವಾಗಿಯೂ ಸಮಯವನ್ನು ತೆಗೆದುಕೊಳ್ಳಲಿಲ್ಲ. HTML ಮತ್ತು CSS ಏನು ಮಾಡಬಹುದೆಂದು ಸರಿಯಾಗಿ ಕಲಿಯಲು ನಾವು ನಿಜವಾಗಿಯೂ ಪ್ರೋತ್ಸಾಹವನ್ನು ಅನುಭವಿಸಲಿಲ್ಲ. ವೆಬ್ ಅನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ವಿಕಸನಗೊಳ್ಳುತ್ತಿರುವ ಅಪ್ಲಿಕೇಶನ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಎಂದು ನಾವು ನಿಜವಾಗಿಯೂ ಗ್ರಹಿಸಲಿಲ್ಲ. ವಿಶೇಷವಾಗಿ ಬ್ರೌಸರ್ ಬೆಂಬಲಕ್ಕೆ ಬಂದಾಗ ನಾವು ಕೆಲಸ ಮಾಡಬೇಕಾದ ವಿಷಯವಾಗಿ ನಾವು ಇದನ್ನು ಹೆಚ್ಚಾಗಿ ನೋಡಿದ್ದೇವೆ. ಕೆಲಸಗಳನ್ನು ಮಾಡಲು ನಾವು ಅದರಲ್ಲಿ ಹೆಚ್ಚಿನ JS ಅನ್ನು ಎಸೆಯಬಹುದು. ವೆಬ್ ಹೇಗೆ ಕೆಲಸ ಮಾಡಿದೆ ಮತ್ತು ಪ್ಲಾಟ್‌ಫಾರ್ಮ್‌ನಲ್ಲಿ ಏನು ಲಭ್ಯವಿದೆ ಎಂಬುದರ ಕುರಿತು ಇನ್ನಷ್ಟು ತಿಳಿದುಕೊಳ್ಳಲು ಸಮಯ ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆಯೇ? ಖಚಿತವಾಗಿ, ನಾನು ಬಹುಶಃ ನಿಜವಾಗಿಯೂ ಅಗತ್ಯವಿಲ್ಲದ ಕೋಡ್‌ನ ಗುಂಪನ್ನು ಶೇವ್ ಮಾಡಿರಬಹುದು. ಆದರೆ, ಆ ಸಮಯದಲ್ಲಿ, ಬಹುಶಃ ಹೆಚ್ಚು ಅಲ್ಲ. ನೀವು ನೋಡಿ, ಬ್ರೌಸರ್ ವ್ಯತ್ಯಾಸಗಳು ಹಿಂದೆ ಬಹಳ ಮಹತ್ವದ್ದಾಗಿತ್ತು. ಇದು ಇಂಟರ್ನೆಟ್ ಎಕ್ಸ್‌ಪ್ಲೋರರ್ ಇನ್ನೂ ಪ್ರಬಲ ಬ್ರೌಸರ್ ಆಗಿರುವ ಸಮಯವಾಗಿತ್ತು, ಫೈರ್‌ಫಾಕ್ಸ್ ಹತ್ತಿರದ ಎರಡನೇ ಸ್ಥಾನದಲ್ಲಿದೆ, ಆದರೆ ಕ್ರೋಮ್ ವೇಗವಾಗಿ ಜನಪ್ರಿಯತೆಯನ್ನು ಗಳಿಸುವ ಕಾರಣ ಮಾರುಕಟ್ಟೆ ಪಾಲನ್ನು ಕಳೆದುಕೊಳ್ಳಲು ಪ್ರಾರಂಭಿಸಿತು. ಕ್ರೋಮ್ ಮತ್ತು ಫೈರ್‌ಫಾಕ್ಸ್ ವೆಬ್ ಮಾನದಂಡಗಳನ್ನು ಒಪ್ಪಿಕೊಳ್ಳುವಲ್ಲಿ ಸಾಕಷ್ಟು ಉತ್ತಮವಾಗಿದ್ದರೂ, ನಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ಗಳು ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತಿರುವ ಪರಿಸರದಲ್ಲಿ ನಾವು ದೀರ್ಘಕಾಲದವರೆಗೆ IE6 ಅನ್ನು ಬೆಂಬಲಿಸಬೇಕಾಗಿತ್ತು. IE8 ಅನ್ನು ಬೆಂಬಲಿಸಲು ನಮಗೆ ಅನುಮತಿಸಿದಾಗಲೂ, ನಾವು ಇನ್ನೂ ಬ್ರೌಸರ್‌ಗಳ ನಡುವೆ ಬಹಳಷ್ಟು ವ್ಯತ್ಯಾಸಗಳನ್ನು ಎದುರಿಸಬೇಕಾಗಿತ್ತು. ಅಷ್ಟೇ ಅಲ್ಲ, ಆ ಕಾಲದ ವೆಬ್ ಕೇವಲ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್‌ನಲ್ಲಿಯೇ ನಿರ್ಮಿಸಲಾದ ಹೆಚ್ಚಿನ ಸಾಮರ್ಥ್ಯಗಳನ್ನು ಹೊಂದಿಲ್ಲ.

ಇವತ್ತಿಗೆ ಫಾಸ್ಟ್ ಫಾರ್ವರ್ಡ್. ವಿಷಯಗಳು ಮಹತ್ತರವಾಗಿ ಬದಲಾಗಿವೆ. ನಾವು ಹಿಂದೆಂದಿಗಿಂತಲೂ ಈ ಸಾಮರ್ಥ್ಯಗಳನ್ನು ಹೊಂದಿದ್ದೇವೆ ಮಾತ್ರವಲ್ಲ, ಅವು ಲಭ್ಯವಾಗುವ ದರವೂ ಹೆಚ್ಚಾಗಿದೆ. ನಾನು ಮತ್ತೊಮ್ಮೆ ಪ್ರಶ್ನೆಯನ್ನು ಕೇಳುತ್ತೇನೆ, ಹಾಗಾದರೆ: ವೆಬ್ ಹೇಗೆ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಮತ್ತು ಪ್ಲಾಟ್‌ಫಾರ್ಮ್‌ನಲ್ಲಿ ಏನು ಲಭ್ಯವಿದೆ ಎಂಬುದರ ಕುರಿತು ಇನ್ನಷ್ಟು ತಿಳಿದುಕೊಳ್ಳಲು ಸಮಯ ತೆಗೆದುಕೊಳ್ಳುವುದು ಇಂದು ನಿಮಗೆ ಸಹಾಯ ಮಾಡುತ್ತದೆ? ಸಂಪೂರ್ಣವಾಗಿ ಹೌದು. ಇಂದು ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಅನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳಲು ಮತ್ತು ಬಳಸಲು ಕಲಿಯುವುದು ಇತರ ಡೆವಲಪರ್‌ಗಳಿಗಿಂತ ಹೆಚ್ಚಿನ ಪ್ರಯೋಜನವನ್ನು ನೀಡುತ್ತದೆ. ನೀವು ಕಾರ್ಯನಿರ್ವಹಣೆ, ಪ್ರವೇಶಿಸುವಿಕೆ, ಸ್ಪಂದಿಸುವಿಕೆ, ಇವೆಲ್ಲವೂ ಒಟ್ಟಾಗಿ ಕೆಲಸ ಮಾಡುತ್ತಿರಲಿ ಅಥವಾ UI ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಶಿಪ್ಪಿಂಗ್ ಮಾಡುತ್ತಿರಲಿ, ನೀವು ಅದನ್ನು ಜವಾಬ್ದಾರಿಯುತ ಇಂಜಿನಿಯರ್ ಆಗಿ ಮಾಡಲು ಬಯಸಿದರೆ, ನಿಮಗೆ ಲಭ್ಯವಿರುವ ಪರಿಕರಗಳನ್ನು ತಿಳಿದುಕೊಳ್ಳುವುದು ನಿಮ್ಮ ಗುರಿಗಳನ್ನು ವೇಗವಾಗಿ ಮತ್ತು ಉತ್ತಮವಾಗಿ ತಲುಪಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ. ಕೆಲವು ವಿಷಯಗಳು ನಿಮಗೆ ಇನ್ನು ಮುಂದೆ ಲೈಬ್ರರಿ ಅಗತ್ಯವಿಲ್ಲದಿರಬಹುದು ಇಂದು ಯಾವ ಬ್ರೌಸರ್‌ಗಳು ಬೆಂಬಲಿಸುತ್ತವೆ ಎಂಬುದನ್ನು ತಿಳಿದುಕೊಳ್ಳುವುದರಿಂದ, ಪ್ರಶ್ನೆ: ನಾವು ಏನನ್ನು ಬಿಡಬಹುದು? 2025 ರಲ್ಲಿ ದುಂಡಾದ ಮೂಲೆಗಳನ್ನು ಮಾಡಲು ನಮಗೆ ಡಿವ್ ಕಾಂಪೊನೆಂಟ್ ಅಗತ್ಯವಿದೆಯೇ? ಖಂಡಿತ, ನಾವು ಮಾಡುವುದಿಲ್ಲ. ಈ ಹಂತದಲ್ಲಿ 15 ವರ್ಷಗಳಿಗೂ ಹೆಚ್ಚು ಕಾಲ ಪ್ರಸ್ತುತ ಬಳಸುತ್ತಿರುವ ಎಲ್ಲಾ ಬ್ರೌಸರ್‌ಗಳಿಂದ ಗಡಿ-ತ್ರಿಜ್ಯದ ಆಸ್ತಿಯನ್ನು ಬೆಂಬಲಿಸಲಾಗಿದೆ. ಮತ್ತು ಕಾರ್ನರ್-ಆಕಾರ ಕೂಡ ಶೀಘ್ರದಲ್ಲೇ ಬರಲಿದೆ, ಇನ್ನೂ ಫ್ಯಾನ್ಸಿಯರ್ ಮೂಲೆಗಳಿಗೆ. ಎಲ್ಲಾ ಪ್ರಮುಖ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಈಗ ಲಭ್ಯವಿರುವ ತುಲನಾತ್ಮಕವಾಗಿ ಇತ್ತೀಚಿನ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ನೋಡೋಣ ಮತ್ತು ನಿಮ್ಮ ಕೋಡ್‌ಬೇಸ್‌ನಲ್ಲಿ ಅಸ್ತಿತ್ವದಲ್ಲಿರುವ ಅವಲಂಬನೆಗಳನ್ನು ಬದಲಾಯಿಸಲು ನೀವು ಬಳಸಬಹುದು. ನಿಮ್ಮ ಎಲ್ಲಾ ಪ್ರೀತಿಯ ಲೈಬ್ರರಿಗಳನ್ನು ತಕ್ಷಣವೇ ಡಿಚ್ ಮಾಡುವುದು ಮತ್ತು ನಿಮ್ಮ ಕೋಡ್‌ಬೇಸ್ ಅನ್ನು ಪುನಃ ಬರೆಯುವುದು ಮುಖ್ಯ ವಿಷಯವಲ್ಲ. ಉಳಿದಂತೆ, ನೀವು ಮೊದಲು ಬ್ರೌಸರ್ ಬೆಂಬಲವನ್ನು ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳಬೇಕಾಗುತ್ತದೆ ಮತ್ತು ನಿಮ್ಮ ಯೋಜನೆಗೆ ನಿರ್ದಿಷ್ಟವಾದ ಇತರ ಅಂಶಗಳ ಆಧಾರದ ಮೇಲೆ ನಿರ್ಧರಿಸಬೇಕು. ಕೆಳಗಿನ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಮೂರು ಮುಖ್ಯ ಬ್ರೌಸರ್ ಎಂಜಿನ್‌ಗಳಲ್ಲಿ ಅಳವಡಿಸಲಾಗಿದೆ (Chromium, WebKit, ಮತ್ತು Gecko), ಆದರೆ ನೀವು ಈಗಿನಿಂದಲೇ ಅವುಗಳನ್ನು ಬಳಸದಂತೆ ತಡೆಯುವ ವಿಭಿನ್ನ ಬ್ರೌಸರ್ ಬೆಂಬಲದ ಅವಶ್ಯಕತೆಗಳನ್ನು ಹೊಂದಿರಬಹುದು. ಈ ವೈಶಿಷ್ಟ್ಯಗಳ ಬಗ್ಗೆ ತಿಳಿದುಕೊಳ್ಳಲು ಈಗ ಇನ್ನೂ ಉತ್ತಮ ಸಮಯ, ಮತ್ತು ಬಹುಶಃ ಅವುಗಳನ್ನು ಕೆಲವು ಹಂತದಲ್ಲಿ ಬಳಸಲು ಯೋಜಿಸಬಹುದು. ಪಾಪೋವರ್ಸ್ ಮತ್ತು ಡೈಲಾಗ್‌ಗಳು Popover API,

HTML ಎಲಿಮೆಂಟ್, ಮತ್ತು :: ಬ್ಯಾಕ್‌ಡ್ರಾಪ್ ಸ್ಯೂಡೋ-ಎಲಿಮೆಂಟ್ ಪಾಪ್‌ಅಪ್ ಮೇಲಿನ ಅವಲಂಬನೆಗಳನ್ನು ತೊಡೆದುಹಾಕಲು ನಿಮಗೆ ಸಹಾಯ ಮಾಡುತ್ತದೆ,ಟೂಲ್‌ಟಿಪ್, ಮತ್ತು ಫ್ಲೋಟಿಂಗ್ ಯುಐ, ಟಿಪ್ಪಿ.ಜೆಎಸ್, ಟೆಥರ್ ಅಥವಾ ರಿಯಾಕ್ಟ್ ಟೂಲ್‌ಟಿಪ್‌ನಂತಹ ಡೈಲಾಗ್ ಲೈಬ್ರರಿಗಳು. ಅವರು ನಿಮಗಾಗಿ ಪ್ರವೇಶಿಸುವಿಕೆ ಮತ್ತು ಫೋಕಸ್ ನಿರ್ವಹಣೆಯನ್ನು ನಿರ್ವಹಿಸುತ್ತಾರೆ, ಬಾಕ್ಸ್‌ನ ಹೊರಗೆ, CSS ಅನ್ನು ಬಳಸುವ ಮೂಲಕ ಹೆಚ್ಚು ಗ್ರಾಹಕೀಯಗೊಳಿಸಬಹುದು ಮತ್ತು ಸುಲಭವಾಗಿ ಅನಿಮೇಟೆಡ್ ಮಾಡಬಹುದು. ಅಕಾರ್ಡಿಯನ್ಸ್
ಎಲಿಮೆಂಟ್, ಪರಸ್ಪರ ವಿಶೇಷ ಅಂಶಗಳಿಗೆ ಅದರ ಹೆಸರು ಗುಣಲಕ್ಷಣ, ಮತ್ತು ::details-content ಸ್ಯೂಡೋ-ಎಲಿಮೆಂಟ್ ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ಅಕಾರ್ಡಿಯನ್ ಅಥವಾ ರಿಯಾಕ್ಟ್ ಅಕಾರ್ಡಿಯನ್ ಘಟಕದಂತಹ ಅಕಾರ್ಡಿಯನ್ ಘಟಕಗಳ ಅಗತ್ಯವನ್ನು ತೆಗೆದುಹಾಕುತ್ತದೆ. ಇಲ್ಲಿ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಅನ್ನು ಬಳಸುವುದರಿಂದ HTML/CSS ತಿಳಿದಿರುವ ಜನರು ನಿರ್ದಿಷ್ಟ ಲೈಬ್ರರಿಯನ್ನು ಬಳಸಲು ಕಲಿಯದೆಯೇ ನಿಮ್ಮ ಕೋಡ್ ಅನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳಲು ಸುಲಭವಾಗಿದೆ ಎಂದರ್ಥ. ಲೈಬ್ರರಿಯಲ್ಲಿನ ಬದಲಾವಣೆಗಳು ಅಥವಾ ಆ ಗ್ರಂಥಾಲಯವನ್ನು ಸ್ಥಗಿತಗೊಳಿಸುವುದರಿಂದ ನೀವು ನಿರೋಧಕರಾಗಿದ್ದೀರಿ ಎಂದರ್ಥ. ಮತ್ತು, ಸಹಜವಾಗಿ, ಡೌನ್‌ಲೋಡ್ ಮಾಡಲು ಮತ್ತು ಚಲಾಯಿಸಲು ಕಡಿಮೆ ಕೋಡ್ ಎಂದರ್ಥ. ಪರಸ್ಪರ ವಿಶೇಷ ವಿವರಗಳ ಅಂಶಗಳಿಗೆ ತೆರೆಯಲು, ಮುಚ್ಚಲು ಅಥವಾ ಅನಿಮೇಟ್ ಮಾಡಲು JS ಅಗತ್ಯವಿಲ್ಲ. ಸಿಎಸ್ಎಸ್ ಸಿಂಟ್ಯಾಕ್ಸ್ ಕ್ಯಾಸ್ಕೇಡ್ ಲೇಯರ್‌ಗಳು, ಹೆಚ್ಚು ಸಂಘಟಿತ CSS ಕೋಡ್‌ಬೇಸ್, CSS ಗೂಡುಕಟ್ಟುವ, ಹೆಚ್ಚು ಕಾಂಪ್ಯಾಕ್ಟ್ CSS, ಹೊಸ ಬಣ್ಣ ಕಾರ್ಯಗಳು, ಸಂಬಂಧಿತ ಬಣ್ಣಗಳು ಮತ್ತು ಬಣ್ಣ-ಮಿಶ್ರಣಕ್ಕಾಗಿ, abs(), ಸೈನ್(), pow() ಮತ್ತು ಇತರ ಹೊಸ ಗಣಿತ ಕಾರ್ಯಗಳು CSS ಪೂರ್ವ-ಸಂಸ್ಕಾರಕಗಳ ಮೇಲಿನ ಅವಲಂಬನೆಯನ್ನು ಕಡಿಮೆ ಮಾಡಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ, ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ಮತ್ತು Tailtime CSS ನಂತಹ ಯುಟಿಲಿಟಿ ಲೈಬ್ರರಿಗಳಲ್ಲಿ- ಅಥವಾ ರನ್-ಜೆಎಸ್ಎಸ್. ಗೇಮ್ ಚೇಂಜರ್ :ಹ್ಯಾಸ್(), ದೀರ್ಘಕಾಲದವರೆಗೆ ಹೆಚ್ಚು ವಿನಂತಿಸಿದ ವೈಶಿಷ್ಟ್ಯಗಳಲ್ಲಿ ಒಂದಾಗಿದೆ, ಹೆಚ್ಚು ಸಂಕೀರ್ಣವಾದ JS-ಆಧಾರಿತ ಪರಿಹಾರಗಳ ಅಗತ್ಯವನ್ನು ತೆಗೆದುಹಾಕುತ್ತದೆ. JS ಉಪಯುಕ್ತತೆಗಳು FindLast(), ಅಥವಾ at() ನಂತಹ ಆಧುನಿಕ ಅರೇ ವಿಧಾನಗಳು, ವ್ಯತ್ಯಾಸ(), ಛೇದನ(), Union() ಮತ್ತು ಇತರ ರೀತಿಯ ಸೆಟ್ ವಿಧಾನಗಳು Lodash ನಂತಹ ಗ್ರಂಥಾಲಯಗಳ ಮೇಲಿನ ಅವಲಂಬನೆಯನ್ನು ಕಡಿಮೆ ಮಾಡಬಹುದು. ಕಂಟೈನರ್ ಪ್ರಶ್ನೆಗಳು ಕಂಟೈನರ್ ಪ್ರಶ್ನೆಗಳು UI ಘಟಕಗಳನ್ನು ವ್ಯೂಪೋರ್ಟ್ ಗಾತ್ರವನ್ನು ಹೊರತುಪಡಿಸಿ ಇತರ ವಿಷಯಗಳಿಗೆ ಪ್ರತಿಕ್ರಿಯಿಸುವಂತೆ ಮಾಡುತ್ತದೆ ಮತ್ತು ಆದ್ದರಿಂದ ಅವುಗಳನ್ನು ವಿವಿಧ ಸಂದರ್ಭಗಳಲ್ಲಿ ಹೆಚ್ಚು ಮರುಬಳಕೆ ಮಾಡುವಂತೆ ಮಾಡುತ್ತದೆ. ಇದಕ್ಕಾಗಿ ಇನ್ನು ಮುಂದೆ JS-ಹೆವಿ UI ಲೈಬ್ರರಿಯನ್ನು ಬಳಸುವ ಅಗತ್ಯವಿಲ್ಲ ಮತ್ತು ಪಾಲಿಫಿಲ್ ಅನ್ನು ಬಳಸುವ ಅಗತ್ಯವಿಲ್ಲ. ಲೇಔಟ್ ಗ್ರಿಡ್, ಸಬ್‌ಗ್ರಿಡ್, ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್ ಅಥವಾ ಮಲ್ಟಿ-ಕಾಲಮ್ ಈಗ ಬಹಳ ಸಮಯದಿಂದ ಇದೆ, ಆದರೆ ಸಿಎಸ್‌ಎಸ್ ಸಮೀಕ್ಷೆಗಳ ಫಲಿತಾಂಶಗಳನ್ನು ನೋಡಿದರೆ, ಡೆವಲಪರ್‌ಗಳು ಹೊಸ ವಿಷಯಗಳನ್ನು ಅಳವಡಿಸಿಕೊಳ್ಳುವಲ್ಲಿ ಬಹಳ ಜಾಗರೂಕರಾಗಿರುತ್ತಾರೆ ಮತ್ತು ಅವರು ಮಾಡುವ ಮೊದಲು ಬಹಳ ಸಮಯ ಕಾಯುತ್ತಾರೆ ಎಂಬುದು ಸ್ಪಷ್ಟವಾಗಿದೆ. ಈ ವೈಶಿಷ್ಟ್ಯಗಳು ದೀರ್ಘಕಾಲದವರೆಗೆ ಬೇಸ್‌ಲೈನ್‌ನಲ್ಲಿವೆ ಮತ್ತು ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್‌ನ ಗ್ರಿಡ್ ಸಿಸ್ಟಮ್, ಫೌಂಡೇಶನ್ ಫ್ರೇಮ್‌ವರ್ಕ್‌ನ ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್ ಉಪಯುಕ್ತತೆಗಳು, ಬುಲ್ಮಾ ಸ್ಥಿರ ಗ್ರಿಡ್, ಮೆಟೀರಿಯಲೈಸ್ ಗ್ರಿಡ್ ಅಥವಾ ಟೈಲ್‌ವಿಂಡ್ ಕಾಲಮ್‌ಗಳಂತಹ ವಿಷಯಗಳ ಮೇಲಿನ ಅವಲಂಬನೆಗಳನ್ನು ತೊಡೆದುಹಾಕಲು ನೀವು ಅವುಗಳನ್ನು ಬಳಸಬಹುದು. ನಿಮ್ಮ ಚೌಕಟ್ಟನ್ನು ಬಿಡಬೇಕು ಎಂದು ನಾನು ಹೇಳುತ್ತಿಲ್ಲ. ನಿಮ್ಮ ತಂಡವು ಒಂದು ಕಾರಣಕ್ಕಾಗಿ ಅದನ್ನು ಅಳವಡಿಸಿಕೊಂಡಿದೆ ಮತ್ತು ಅದನ್ನು ತೆಗೆದುಹಾಕುವುದು ದೊಡ್ಡ ಯೋಜನೆಯಾಗಿರಬಹುದು. ಆದರೆ ಥರ್ಡ್-ಪಾರ್ಟಿ ರ್ಯಾಪರ್ ಇಲ್ಲದೆಯೇ ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಏನನ್ನು ನೀಡುತ್ತದೆ ಎಂಬುದನ್ನು ನೋಡುವುದು ಬಹಳಷ್ಟು ಪ್ರಯೋಜನಗಳೊಂದಿಗೆ ಬರುತ್ತದೆ. ಮುಂದಿನ ದಿನಗಳಲ್ಲಿ ನಿಮಗೆ ಅಗತ್ಯವಿಲ್ಲದ ವಿಷಯಗಳು ಈಗ, ಮುಂದಿನ ದಿನಗಳಲ್ಲಿ ನಿಮಗೆ ಗ್ರಂಥಾಲಯದ ಅಗತ್ಯವಿಲ್ಲದ ಕೆಲವು ವಿಷಯಗಳನ್ನು ತ್ವರಿತವಾಗಿ ನೋಡೋಣ. ಅಂದರೆ, ಕೆಳಗಿನ ವಿಷಯಗಳು ಸಾಮೂಹಿಕ ಅಳವಡಿಕೆಗೆ ಸಿದ್ಧವಾಗಿಲ್ಲ, ಆದರೆ ಅವುಗಳ ಬಗ್ಗೆ ತಿಳಿದಿರುವುದು ಮತ್ತು ಸಂಭಾವ್ಯ ನಂತರದ ಬಳಕೆಗಾಗಿ ಯೋಜನೆ ಮಾಡುವುದು ಸಹಾಯಕವಾಗಬಹುದು. ಆಂಕರ್ ಸ್ಥಾನೀಕರಣ CSS ಆಂಕರ್ ಸ್ಥಾನೀಕರಣವು ಇತರ ಅಂಶಗಳಿಗೆ ಸಂಬಂಧಿಸಿದಂತೆ ಪಾಪೋವರ್‌ಗಳು ಮತ್ತು ಟೂಲ್‌ಟಿಪ್‌ಗಳ ಸ್ಥಾನೀಕರಣವನ್ನು ನಿರ್ವಹಿಸುತ್ತದೆ ಮತ್ತು ಪುಟವನ್ನು ಚಲಿಸುವಾಗ, ಸ್ಕ್ರೋಲಿಂಗ್ ಮಾಡುವಾಗ ಅಥವಾ ಮರುಗಾತ್ರಗೊಳಿಸುವಾಗ ಸಹ ಅವುಗಳನ್ನು ದೃಷ್ಟಿಯಲ್ಲಿ ಇರಿಸಿಕೊಳ್ಳಲು ಕಾಳಜಿ ವಹಿಸುತ್ತದೆ. ಇದು ಮೊದಲು ಉಲ್ಲೇಖಿಸಲಾದ Popover API ಗೆ ಉತ್ತಮ ಪೂರಕವಾಗಿದೆ, ಇದು ಹೆಚ್ಚು ಕಾರ್ಯಕ್ಷಮತೆ-ತೀವ್ರವಾದ JS ಪರಿಹಾರಗಳಿಂದ ದೂರಕ್ಕೆ ವಲಸೆ ಹೋಗುವುದನ್ನು ಇನ್ನಷ್ಟು ಸುಲಭಗೊಳಿಸುತ್ತದೆ. ನ್ಯಾವಿಗೇಶನ್ API ನ್ಯಾವಿಗೇಷನ್ API ಅನ್ನು ಏಕ-ಪುಟದ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಲ್ಲಿ ನ್ಯಾವಿಗೇಷನ್ ನಿರ್ವಹಿಸಲು ಬಳಸಬಹುದು ಮತ್ತು ರೂಟರ್, Next.js ರೂಟಿಂಗ್ ಅಥವಾ ಕೋನೀಯ ರೂಟಿಂಗ್ ಕಾರ್ಯಗಳಿಗೆ ಉತ್ತಮ ಪೂರಕ ಅಥವಾ ಬದಲಿಯಾಗಿರಬಹುದು. ಪರಿವರ್ತನೆಗಳ API ಅನ್ನು ವೀಕ್ಷಿಸಿ ವೀಕ್ಷಣೆ ಪರಿವರ್ತನೆಗಳ API ಪುಟದ ವಿವಿಧ ಸ್ಥಿತಿಗಳ ನಡುವೆ ಅನಿಮೇಟ್ ಮಾಡಬಹುದು. ಏಕ-ಪುಟದ ಅಪ್ಲಿಕೇಶನ್‌ನಲ್ಲಿ, ಇದು ರಾಜ್ಯಗಳ ನಡುವೆ ಸುಗಮ ಪರಿವರ್ತನೆಗಳನ್ನು ಮಾಡುತ್ತದೆ ಮತ್ತು Anime.js, GSAP, ಅಥವಾ Motion.dev ನಂತಹ ಅನಿಮೇಷನ್ ಲೈಬ್ರರಿಗಳನ್ನು ತೊಡೆದುಹಾಕಲು ನಿಮಗೆ ಸಹಾಯ ಮಾಡುತ್ತದೆ. ಇನ್ನೂ ಉತ್ತಮ, API ಅನ್ನು ಬಹು-ಪುಟದ ಅಪ್ಲಿಕೇಶನ್‌ಗಳೊಂದಿಗೆ ಸಹ ಬಳಸಬಹುದು. 15 ವರ್ಷಗಳ ಹಿಂದೆ ನಾನು ಕೆಲಸ ಮಾಡಿದ ಕಂಪನಿಯಲ್ಲಿ ಒಂದೇ ಪುಟದ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ನಿರ್ಮಿಸಲು ಕಾರಣವೆಂದರೆ ನ್ಯಾವಿಗೇಟ್ ಮಾಡುವಾಗ ಪುಟದ ಮರುಲೋಡ್‌ಗಳ ಬಿಳಿ ಫ್ಲ್ಯಾಷ್ ಅನ್ನು ತಪ್ಪಿಸುವುದು ಎಂದು ನಾನು ಮೊದಲೇ ಹೇಳಿದಾಗ ನೆನಪಿದೆಯೇ? ಆ ಸಮಯದಲ್ಲಿ ಆ API ಲಭ್ಯವಿದ್ದರೆ, ಒಂದೇ ಪುಟದ ಚೌಕಟ್ಟು ಇಲ್ಲದೆ ಮತ್ತು ಸಂಪೂರ್ಣ ಅಪ್ಲಿಕೇಶನ್‌ನ ದೊಡ್ಡ ಆರಂಭಿಕ ಡೌನ್‌ಲೋಡ್ ಇಲ್ಲದೆಯೇ ಸುಂದರವಾದ ಪುಟ ಪರಿವರ್ತನೆ ಪರಿಣಾಮಗಳನ್ನು ಸಾಧಿಸಲು ನಮಗೆ ಸಾಧ್ಯವಾಗುತ್ತದೆ. ಸ್ಕ್ರಾಲ್-ಚಾಲಿತ ಅನಿಮೇಷನ್‌ಗಳು ಸ್ಕ್ರಾಲ್-ಚಾಲಿತ ಅನಿಮೇಷನ್‌ಗಳು ಕಾಲಾನಂತರದಲ್ಲಿ ಬಳಕೆದಾರರ ಸ್ಕ್ರಾಲ್ ಸ್ಥಾನದ ಮೇಲೆ ಚಲಿಸುತ್ತವೆ, ಇದು ಕಥೆ ಹೇಳುವಿಕೆ ಮತ್ತು ಉತ್ಪನ್ನ ಪ್ರವಾಸಗಳಿಗೆ ಉತ್ತಮ ಪರಿಹಾರವಾಗಿದೆ. ಕೆಲವು ಜನರು ಅದರೊಂದಿಗೆ ಸ್ವಲ್ಪ ಮೇಲಕ್ಕೆ ಹೋಗಿದ್ದಾರೆ, ಆದರೆ ಉತ್ತಮವಾಗಿ ಬಳಸಿದಾಗ, ಇದು ಅತ್ಯಂತ ಪರಿಣಾಮಕಾರಿ ವಿನ್ಯಾಸ ಸಾಧನವಾಗಿದೆ ಮತ್ತು ಗ್ರಂಥಾಲಯಗಳನ್ನು ತೊಡೆದುಹಾಕಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ: ScrollReveal, GSAP ಸ್ಕ್ರಾಲ್, ಅಥವಾWOW.js. ಗ್ರಾಹಕೀಯಗೊಳಿಸಬಹುದಾದ ಆಯ್ಕೆಗಳು ಗ್ರಾಹಕೀಯಗೊಳಿಸಬಹುದಾದ ಆಯ್ಕೆಯು ಸಾಮಾನ್ಯ <ಆಯ್ಕೆ> ಅಂಶವಾಗಿದ್ದು, ಪ್ರವೇಶ ಮತ್ತು ಕಾರ್ಯಕ್ಷಮತೆಯ ಪ್ರಯೋಜನಗಳನ್ನು ಖಾತ್ರಿಪಡಿಸುವಾಗ ಅದರ ಗೋಚರತೆ ಮತ್ತು ವಿಷಯವನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ಕಸ್ಟಮೈಸ್ ಮಾಡಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ. ಇದು ಬಹಳ ಸಮಯದಿಂದ ಬಂದಿದೆ ಮತ್ತು ಹೆಚ್ಚು ವಿನಂತಿಸಿದ ವೈಶಿಷ್ಟ್ಯವಾಗಿದೆ ಮತ್ತು ಇದು ಶೀಘ್ರದಲ್ಲೇ ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್‌ಗೆ ಬರುವುದನ್ನು ನೋಡಲು ಅದ್ಭುತವಾಗಿದೆ. ಅಂತರ್ನಿರ್ಮಿತ ಕಸ್ಟಮೈಸ್ ಮಾಡಬಹುದಾದ ಆಯ್ಕೆಯೊಂದಿಗೆ, ನಿಮ್ಮ ಕಸ್ಟಮ್ ಆಯ್ದ ಘಟಕಗಳಿಗಾಗಿ ನೀವು ನಿರ್ವಹಿಸಲು ಕಷ್ಟವಾದ JS ಕೋಡ್ ಅನ್ನು ಅಂತಿಮವಾಗಿ ಬಿಡಬಹುದು. ಸಿಎಸ್ಎಸ್ ಕಲ್ಲು CSS ಮ್ಯಾಸನ್ರಿಯು ಮುಂಬರುವ ಮತ್ತೊಂದು ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ವೈಶಿಷ್ಟ್ಯವಾಗಿದ್ದು, ನಾನು ಹೆಚ್ಚಿನ ಸಮಯವನ್ನು ಕಳೆಯಲು ಬಯಸುತ್ತೇನೆ. CSS ಮ್ಯಾಸನ್ರಿಯೊಂದಿಗೆ, ನೀವು ಫ್ಲೆಕ್ಸ್, ಗ್ರಿಡ್ ಅಥವಾ ಇತರ ಅಂತರ್ನಿರ್ಮಿತ CSS ಲೇಔಟ್ ಪ್ರೈಮಿಟಿವ್‌ಗಳೊಂದಿಗೆ ತುಂಬಾ ಕಠಿಣವಾದ ಅಥವಾ ಅಸಾಧ್ಯವಾದ ಲೇಔಟ್‌ಗಳನ್ನು ಸಾಧಿಸಬಹುದು. ಮ್ಯಾಸನ್ರಿ JS ಲೈಬ್ರರಿಯಂತಹ ಮ್ಯಾಸನ್ರಿ ಲೇಔಟ್‌ಗಳನ್ನು ಸಾಧಿಸಲು ಡೆವಲಪರ್‌ಗಳು ಸಾಮಾನ್ಯವಾಗಿ ಥರ್ಡ್-ಪಾರ್ಟಿ ಲೈಬ್ರರಿಗಳನ್ನು ಬಳಸುತ್ತಾರೆ. ಆದರೆ, ನಂತರ ಹೆಚ್ಚು. ಮ್ಯಾಸನ್ರಿಗೆ ತೆರಳುವ ಮೊದಲು ಈ ಅಂಶವನ್ನು ಸುತ್ತಿಕೊಳ್ಳೋಣ. ಏಕೆ ನೀವು ಕಾಳಜಿ ವಹಿಸಬೇಕು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಮತ್ತು ದಿನದ ಇತ್ತೀಚಿನ ಚೌಕಟ್ಟುಗಳಲ್ಲಿ ಅನುಭವ ಹೊಂದಿರುವ ವೆಬ್ ಡೆವಲಪರ್‌ಗಳಿಂದ ಉದ್ಯೋಗ ಮಾರುಕಟ್ಟೆ ತುಂಬಿದೆ. ಆದ್ದರಿಂದ, ನಿಜವಾಗಿಯೂ, ಇಂದು ನೀವು ಈಗಾಗಲೇ ತಿಳಿದಿರುವ ಲೈಬ್ರರಿಗಳು, ಉಪಯುಕ್ತತೆಗಳು ಮತ್ತು ಫ್ರೇಮ್‌ವರ್ಕ್‌ಗಳೊಂದಿಗೆ ನೀವು ಅದೇ ಕೆಲಸಗಳನ್ನು ಮಾಡಬಹುದಾದರೆ, ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಮೂಲಗಳನ್ನು ಹೆಚ್ಚು ಬಳಸಲು ಕಲಿಯುವುದರಲ್ಲಿ ಏನು ಅರ್ಥವಿದೆ? ಇಡೀ ಉದ್ಯಮವು ಈ ಚೌಕಟ್ಟುಗಳ ಮೇಲೆ ಅವಲಂಬಿತವಾದಾಗ, ಮತ್ತು ನೀವು ಸರಿಯಾದ ಲೈಬ್ರರಿಯನ್ನು ಎಳೆಯಬಹುದು, ಬದಲಿಗೆ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಅನ್ನು ಬಳಸಲು ಡೆವಲಪರ್‌ಗಳನ್ನು ಮನವೊಲಿಸುವ ಬದಲು ಅವುಗಳನ್ನು ಲೋಡ್ ಮಾಡಲು ಮತ್ತು ವೇಗವಾಗಿ ರನ್ ಮಾಡಲು ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರು ಈ ಲೈಬ್ರರಿಗಳೊಂದಿಗೆ ಕೆಲಸ ಮಾಡಬೇಕಲ್ಲವೇ? ಮೊದಲನೆಯದಾಗಿ, ನಾವು ಲೈಬ್ರರಿ ಲೇಖಕರೊಂದಿಗೆ ಕೆಲಸ ಮಾಡುತ್ತೇವೆ ಮತ್ತು ಅವರು ಏನು ಬಳಸುತ್ತಾರೆ ಎಂಬುದರ ಕುರಿತು ಕಲಿಯುವ ಮೂಲಕ ಮತ್ತು ಆ ಪ್ರದೇಶಗಳನ್ನು ಸುಧಾರಿಸುವ ಮೂಲಕ ನಾವು ಚೌಕಟ್ಟುಗಳನ್ನು ಉತ್ತಮಗೊಳಿಸುತ್ತೇವೆ. ಆದರೆ ಎರಡನೆಯದಾಗಿ, "ಕೇವಲ ವೇದಿಕೆಯನ್ನು ಬಳಸುವುದು" ಸಾಕಷ್ಟು ಗಮನಾರ್ಹ ಪ್ರಯೋಜನಗಳನ್ನು ತರಬಹುದು. ಸಾಧನಗಳಿಗೆ ಕಡಿಮೆ ಕೋಡ್ ಕಳುಹಿಸಲಾಗುತ್ತಿದೆ ಮುಖ್ಯ ಪ್ರಯೋಜನವೆಂದರೆ ನಿಮ್ಮ ಗ್ರಾಹಕರ ಸಾಧನಗಳಿಗೆ ನೀವು ಕಡಿಮೆ ಕೋಡ್ ಅನ್ನು ಕಳುಹಿಸುತ್ತೀರಿ. 2024 ರ ವೆಬ್ ಅಲ್ಮಾನಾಕ್ ಪ್ರಕಾರ, ಪ್ರತಿ ಸೈಟ್‌ಗೆ ಸರಾಸರಿ 70 HTTP ವಿನಂತಿಗಳು, ಇವುಗಳಲ್ಲಿ ಹೆಚ್ಚಿನವು 23 ವಿನಂತಿಗಳೊಂದಿಗೆ JavaScript ಗೆ ಕಾರಣವಾಗಿದೆ. 2024 ರಲ್ಲಿ, JS ಚಿತ್ರಗಳನ್ನು ಪ್ರಬಲ ಫೈಲ್ ಪ್ರಕಾರವಾಗಿ ಹಿಂದಿಕ್ಕಿತು. JS ಫೈಲ್‌ಗಳಿಗಾಗಿ ಪುಟ ವಿನಂತಿಗಳ ಸರಾಸರಿ ಸಂಖ್ಯೆ 23 ಆಗಿದೆ, 2022 ರಿಂದ 8% ಹೆಚ್ಚಾಗಿದೆ. ಮತ್ತು ಪುಟದ ಗಾತ್ರವು ವರ್ಷದಿಂದ ವರ್ಷಕ್ಕೆ ಬೆಳೆಯುತ್ತಲೇ ಇದೆ. ಸರಾಸರಿ ಪುಟದ ತೂಕವು ಈಗ ಸುಮಾರು 2MB ಆಗಿದೆ, ಇದು 10 ವರ್ಷಗಳ ಹಿಂದೆ ಇದ್ದಕ್ಕಿಂತ 1.8MB ಹೆಚ್ಚಾಗಿದೆ.

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

ಅಂತರ್ನಿರ್ಮಿತ ಮ್ಯಾಸನ್ರಿ ಲೇಔಟ್ ಒಂದು ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ವೈಶಿಷ್ಟ್ಯವು ಶೀಘ್ರದಲ್ಲೇ ಬರಲಿದೆ ಮತ್ತು ನಾನು ತುಂಬಾ ಉತ್ಸುಕನಾಗಿದ್ದೇನೆ CSS ಮ್ಯಾಸನ್ರಿ.

ಮ್ಯಾಸನ್ರಿ ಎಂದರೇನು ಎಂಬುದನ್ನು ವಿವರಿಸುವ ಮೂಲಕ ನಾನು ಪ್ರಾರಂಭಿಸುತ್ತೇನೆ. ಮ್ಯಾಸನ್ರಿ ಎಂದರೇನು ಮ್ಯಾಸನ್ರಿ ಎನ್ನುವುದು Pinterest ವರ್ಷಗಳ ಹಿಂದೆ ಜನಪ್ರಿಯಗೊಳಿಸಿದ ಒಂದು ರೀತಿಯ ವಿನ್ಯಾಸವಾಗಿದೆ. ಇದು ವಿಷಯದ ಸ್ವತಂತ್ರ ಟ್ರ್ಯಾಕ್‌ಗಳನ್ನು ರಚಿಸುತ್ತದೆ, ಅದರೊಳಗೆ ಐಟಂಗಳು ಟ್ರ್ಯಾಕ್‌ನ ಪ್ರಾರಂಭಕ್ಕೆ ಸಾಧ್ಯವಾದಷ್ಟು ಹತ್ತಿರವಾಗಿ ಪ್ಯಾಕ್ ಮಾಡುತ್ತವೆ.

ಅನೇಕ ಜನರು ಮ್ಯಾಸನ್ರಿಯನ್ನು ಪೋರ್ಟ್ಫೋಲಿಯೊಗಳು ಮತ್ತು ಫೋಟೋ ಗ್ಯಾಲರಿಗಳಿಗೆ ಉತ್ತಮ ಆಯ್ಕೆಯಾಗಿ ನೋಡುತ್ತಾರೆ, ಅದು ಖಂಡಿತವಾಗಿಯೂ ಮಾಡಬಹುದು. ಆದರೆ Pinterest ನಲ್ಲಿ ನೀವು ನೋಡುವುದಕ್ಕಿಂತ ಮ್ಯಾಸನ್ರಿ ಹೆಚ್ಚು ಹೊಂದಿಕೊಳ್ಳುತ್ತದೆ ಮತ್ತು ಇದು ಕೇವಲ ಜಲಪಾತದಂತಹ ವಿನ್ಯಾಸಗಳಿಗೆ ಸೀಮಿತವಾಗಿಲ್ಲ. ಕಲ್ಲಿನ ವಿನ್ಯಾಸದಲ್ಲಿ:

ಟ್ರ್ಯಾಕ್‌ಗಳು ಕಾಲಮ್‌ಗಳು ಅಥವಾ ಸಾಲುಗಳಾಗಿರಬಹುದು:

ವಿಷಯದ ಟ್ರ್ಯಾಕ್‌ಗಳು ಒಂದೇ ಗಾತ್ರದಲ್ಲಿರಬೇಕು:

ಐಟಂಗಳು ಬಹು ಟ್ರ್ಯಾಕ್‌ಗಳನ್ನು ವ್ಯಾಪಿಸಬಹುದು:

ಐಟಂಗಳನ್ನು ನಿರ್ದಿಷ್ಟ ಟ್ರ್ಯಾಕ್ಗಳಲ್ಲಿ ಇರಿಸಬಹುದು; ಅವರು ಯಾವಾಗಲೂ ಸ್ವಯಂಚಾಲಿತ ಪ್ಲೇಸ್‌ಮೆಂಟ್ ಅಲ್ಗಾರಿದಮ್ ಅನ್ನು ಅನುಸರಿಸಬೇಕಾಗಿಲ್ಲ:

ಡೆಮೊಗಳು ಕ್ರೋಮಿಯಂನಲ್ಲಿ ಮುಂಬರುವ CSS ಮ್ಯಾಸನ್ರಿ ಅನುಷ್ಠಾನವನ್ನು ಬಳಸಿಕೊಂಡು ನಾನು ಮಾಡಿದ ಕೆಲವು ಸರಳ ಡೆಮೊಗಳು ಇಲ್ಲಿವೆ. ಫೋಟೋ ಗ್ಯಾಲರಿ ಡೆಮೊ, ಐಟಂಗಳು (ಈ ಸಂದರ್ಭದಲ್ಲಿ ಶೀರ್ಷಿಕೆ) ಬಹು ಟ್ರ್ಯಾಕ್‌ಗಳನ್ನು ಹೇಗೆ ವ್ಯಾಪಿಸಬಹುದು ಎಂಬುದನ್ನು ತೋರಿಸುತ್ತದೆ:

ವಿಭಿನ್ನ ಗಾತ್ರದ ಟ್ರ್ಯಾಕ್‌ಗಳನ್ನು ತೋರಿಸುವ ಮತ್ತೊಂದು ಫೋಟೋ ಗ್ಯಾಲರಿ:

ಕೆಲವು ಟ್ರ್ಯಾಕ್‌ಗಳನ್ನು ಇತರರಿಗಿಂತ ಅಗಲವಿರುವ ಸುದ್ದಿ ಸೈಟ್ ಲೇಔಟ್ ಮತ್ತು ಕೆಲವು ಐಟಂಗಳು ಲೇಔಟ್‌ನ ಸಂಪೂರ್ಣ ಅಗಲವನ್ನು ವ್ಯಾಪಿಸುತ್ತವೆ:

ನಿರ್ದಿಷ್ಟ ಟ್ರ್ಯಾಕ್‌ಗಳಲ್ಲಿ ಐಟಂಗಳನ್ನು ಇರಿಸಬಹುದು ಎಂದು ತೋರಿಸುವ ಕಾನ್ಬನ್ ಬೋರ್ಡ್:

ಗಮನಿಸಿ: ದಿಹಿಂದಿನ ಡೆಮೊಗಳನ್ನು ಕ್ರೋಮಿಯಂನ ಆವೃತ್ತಿಯೊಂದಿಗೆ ಮಾಡಲಾಗಿದ್ದು ಅದು ಹೆಚ್ಚಿನ ವೆಬ್ ಬಳಕೆದಾರರಿಗೆ ಇನ್ನೂ ಲಭ್ಯವಿಲ್ಲ, ಏಕೆಂದರೆ CSS ಮ್ಯಾಸನ್ರಿ ಕೇವಲ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಕಾರ್ಯಗತಗೊಳ್ಳಲು ಪ್ರಾರಂಭಿಸುತ್ತಿದೆ. ಆದಾಗ್ಯೂ, ವೆಬ್ ಡೆವಲಪರ್‌ಗಳು ಈಗಾಗಲೇ ವರ್ಷಗಳಿಂದ ಮ್ಯಾಸನ್ರಿ ಲೇಔಟ್‌ಗಳನ್ನು ರಚಿಸಲು ಲೈಬ್ರರಿಗಳನ್ನು ಸಂತೋಷದಿಂದ ಬಳಸುತ್ತಿದ್ದಾರೆ. ಇಂದು ಕಲ್ಲುಗಳನ್ನು ಬಳಸುವ ಸೈಟ್‌ಗಳು ವಾಸ್ತವವಾಗಿ, ಇಂದು ವೆಬ್‌ನಲ್ಲಿ ಮ್ಯಾಸನ್ರಿ ಬಹಳ ಸಾಮಾನ್ಯವಾಗಿದೆ. Pinterest ಜೊತೆಗೆ ನಾನು ಕಂಡುಕೊಂಡ ಕೆಲವು ಉದಾಹರಣೆಗಳು ಇಲ್ಲಿವೆ:

ಮತ್ತು ಇನ್ನೂ ಕೆಲವು, ಕಡಿಮೆ ಸ್ಪಷ್ಟ, ಉದಾಹರಣೆಗಳು:

ಹಾಗಾದರೆ, ಈ ವಿನ್ಯಾಸಗಳನ್ನು ಹೇಗೆ ರಚಿಸಲಾಗಿದೆ? ಪರಿಹಾರೋಪಾಯಗಳು ನಾನು ಬಳಸಿದ ಒಂದು ಟ್ರಿಕ್ ಎಂದರೆ ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್ ವಿನ್ಯಾಸವನ್ನು ಬಳಸುವುದು, ಅದರ ದಿಕ್ಕನ್ನು ಕಾಲಮ್‌ಗೆ ಬದಲಾಯಿಸುವುದು ಮತ್ತು ಅದನ್ನು ಸುತ್ತುವಂತೆ ಹೊಂದಿಸುವುದು. ಈ ರೀತಿಯಾಗಿ, ನೀವು ವಿವಿಧ ಎತ್ತರದ ವಸ್ತುಗಳನ್ನು ಬಹು, ಸ್ವತಂತ್ರ ಕಾಲಮ್‌ಗಳಲ್ಲಿ ಇರಿಸಬಹುದು, ಇದು ಮ್ಯಾಸನ್ರಿ ಲೇಔಟ್‌ನ ಅನಿಸಿಕೆ ನೀಡುತ್ತದೆ:

ಆದಾಗ್ಯೂ, ಈ ಪರಿಹಾರದೊಂದಿಗೆ ಎರಡು ಮಿತಿಗಳಿವೆ:

ವಸ್ತುಗಳ ಕ್ರಮವು ನಿಜವಾದ ಮ್ಯಾಸನ್ರಿ ಲೇಔಟ್ನೊಂದಿಗೆ ಇರುವುದಕ್ಕಿಂತ ಭಿನ್ನವಾಗಿದೆ. ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್‌ನೊಂದಿಗೆ, ಐಟಂಗಳು ಮೊದಲ ಕಾಲಮ್ ಅನ್ನು ಮೊದಲು ಭರ್ತಿ ಮಾಡಿ ಮತ್ತು ಅದು ತುಂಬಿದಾಗ, ಮುಂದಿನ ಕಾಲಮ್‌ಗೆ ಹೋಗಿ. ಮ್ಯಾಸನ್ರಿಯೊಂದಿಗೆ, ಯಾವುದೇ ಟ್ರ್ಯಾಕ್‌ನಲ್ಲಿ (ಅಥವಾ ಈ ಸಂದರ್ಭದಲ್ಲಿ ಕಾಲಮ್) ಹೆಚ್ಚು ಸ್ಥಳಾವಕಾಶ ಲಭ್ಯವಿದ್ದರೆ ಐಟಂಗಳನ್ನು ಜೋಡಿಸಲಾಗುತ್ತದೆ. ಆದರೆ, ಮತ್ತು ಬಹುಶಃ ಹೆಚ್ಚು ಮುಖ್ಯವಾಗಿ, ಈ ಪರಿಹಾರಕ್ಕೆ ನೀವು ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್ ಕಂಟೇನರ್‌ಗೆ ಸ್ಥಿರ ಎತ್ತರವನ್ನು ಹೊಂದಿಸುವ ಅಗತ್ಯವಿದೆ; ಇಲ್ಲದಿದ್ದರೆ, ಯಾವುದೇ ಸುತ್ತುವಿಕೆ ಸಂಭವಿಸುವುದಿಲ್ಲ.

ಥರ್ಡ್-ಪಾರ್ಟಿ ಮ್ಯಾಸನ್ರಿ ಲೈಬ್ರರಿಗಳು ಹೆಚ್ಚು ಮುಂದುವರಿದ ಸಂದರ್ಭಗಳಲ್ಲಿ, ಡೆವಲಪರ್‌ಗಳು ಲೈಬ್ರರಿಗಳನ್ನು ಬಳಸುತ್ತಿದ್ದಾರೆ. ಇದಕ್ಕಾಗಿ ಅತ್ಯಂತ ಪ್ರಸಿದ್ಧ ಮತ್ತು ಜನಪ್ರಿಯ ಗ್ರಂಥಾಲಯವನ್ನು ಸರಳವಾಗಿ ಮ್ಯಾಸನ್ರಿ ಎಂದು ಕರೆಯಲಾಗುತ್ತದೆ ಮತ್ತು NPM ಪ್ರಕಾರ ಇದು ವಾರಕ್ಕೆ ಸುಮಾರು 200,000 ಬಾರಿ ಡೌನ್‌ಲೋಡ್ ಆಗುತ್ತದೆ. ಸ್ಕ್ವೇರ್‌ಸ್ಪೇಸ್ ಯಾವುದೇ ಕೋಡ್ ಪರ್ಯಾಯಕ್ಕಾಗಿ ಮ್ಯಾಸನ್ರಿ ಲೇಔಟ್ ಅನ್ನು ನಿರೂಪಿಸುವ ಲೇಔಟ್ ಘಟಕವನ್ನು ಸಹ ಒದಗಿಸುತ್ತದೆ ಮತ್ತು ಅನೇಕ ಸೈಟ್‌ಗಳು ಇದನ್ನು ಬಳಸುತ್ತವೆ. ಈ ಎರಡೂ ಆಯ್ಕೆಗಳು ಲೇಔಟ್‌ನಲ್ಲಿ ಐಟಂಗಳನ್ನು ಇರಿಸಲು JavaScript ಕೋಡ್ ಅನ್ನು ಬಳಸುತ್ತವೆ. ಅಂತರ್ನಿರ್ಮಿತ ಕಲ್ಲು ಮ್ಯಾಸನ್ರಿ ಈಗ ಅಂತರ್ನಿರ್ಮಿತ CSS ವೈಶಿಷ್ಟ್ಯವಾಗಿ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಕಾಣಿಸಿಕೊಳ್ಳಲು ಪ್ರಾರಂಭಿಸುತ್ತಿದೆ ಎಂದು ನಾನು ನಿಜವಾಗಿಯೂ ಉತ್ಸುಕನಾಗಿದ್ದೇನೆ. ಕಾಲಾನಂತರದಲ್ಲಿ, ನೀವು ಗ್ರಿಡ್ ಅಥವಾ ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್ ಮಾಡುವಂತೆಯೇ ಮ್ಯಾಸನ್ರಿಯನ್ನು ಬಳಸಲು ಸಾಧ್ಯವಾಗುತ್ತದೆ, ಅಂದರೆ, ಯಾವುದೇ ಪರಿಹಾರಗಳು ಅಥವಾ ಮೂರನೇ ವ್ಯಕ್ತಿಯ ಕೋಡ್ ಅಗತ್ಯವಿಲ್ಲ. ಮೈಕ್ರೋಸಾಫ್ಟ್‌ನಲ್ಲಿರುವ ನನ್ನ ತಂಡವು ಕ್ರೋಮಿಯಂ ಓಪನ್ ಸೋರ್ಸ್ ಪ್ರಾಜೆಕ್ಟ್‌ನಲ್ಲಿ ಬಿಲ್ಟ್-ಇನ್ ಮ್ಯಾಸನ್ರಿ ಬೆಂಬಲವನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸುತ್ತಿದೆ, ಇದು ಎಡ್ಜ್, ಕ್ರೋಮ್ ಮತ್ತು ಇತರ ಹಲವು ಬ್ರೌಸರ್‌ಗಳನ್ನು ಆಧರಿಸಿದೆ. Mozilla ವಾಸ್ತವವಾಗಿ 2020 ರಲ್ಲಿ ಮ್ಯಾಸನ್ರಿ ಪ್ರಾಯೋಗಿಕ ಅನುಷ್ಠಾನವನ್ನು ಪ್ರಸ್ತಾಪಿಸಿದ ಮೊದಲ ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರ. ವೈಶಿಷ್ಟ್ಯವನ್ನು ಪ್ರಮಾಣೀಕರಿಸುವ ಕೆಲಸವು ಸಹ ಮುಂದುವರಿಯುತ್ತಿದೆ, ಸಾಮಾನ್ಯ ದಿಕ್ಕಿನ ಕುರಿತು CSS ಕಾರ್ಯ ಗುಂಪಿನೊಳಗೆ ಒಪ್ಪಂದ ಮತ್ತು ಹೊಸ ಪ್ರದರ್ಶನ ಪ್ರಕಾರದ ಪ್ರದರ್ಶನ: ಗ್ರಿಡ್-ಲೇನ್ಸ್. ನೀವು ಕಲ್ಲಿನ ಬಗ್ಗೆ ಇನ್ನಷ್ಟು ತಿಳಿದುಕೊಳ್ಳಲು ಮತ್ತು ಪ್ರಗತಿಯನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಬಯಸಿದರೆ, ನನ್ನ CSS ಮ್ಯಾಸನ್ರಿ ಸಂಪನ್ಮೂಲಗಳ ಪುಟವನ್ನು ಪರಿಶೀಲಿಸಿ. ಕಾಲಾನಂತರದಲ್ಲಿ, ಗ್ರಿಡ್ ಅಥವಾ ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್‌ನಂತೆಯೇ ಮ್ಯಾಸನ್ರಿಯು ಬೇಸ್‌ಲೈನ್ ವೈಶಿಷ್ಟ್ಯವಾದಾಗ, ನಾವು ಅದನ್ನು ಸರಳವಾಗಿ ಬಳಸಲು ಮತ್ತು ಇದರಿಂದ ಲಾಭ ಪಡೆಯಲು ಸಾಧ್ಯವಾಗುತ್ತದೆ:

ಉತ್ತಮ ಕಾರ್ಯಕ್ಷಮತೆ, ಉತ್ತಮ ಪ್ರತಿಕ್ರಿಯೆ, ಬಳಕೆಯ ಸುಲಭ ಮತ್ತು ಸರಳವಾದ ಕೋಡ್.

ಇವುಗಳನ್ನು ಹತ್ತಿರದಿಂದ ನೋಡೋಣ. ಉತ್ತಮ ಕಾರ್ಯಕ್ಷಮತೆ ನಿಮ್ಮ ಸ್ವಂತ ಮ್ಯಾಸನ್ರಿ ತರಹದ ಲೇಔಟ್ ಸಿಸ್ಟಮ್ ಅನ್ನು ಮಾಡುವುದು ಅಥವಾ ಬದಲಿಗೆ ಮೂರನೇ ವ್ಯಕ್ತಿಯ ಲೈಬ್ರರಿಯನ್ನು ಬಳಸುವುದು ಎಂದರೆ ಪರದೆಯ ಮೇಲೆ ಐಟಂಗಳನ್ನು ಇರಿಸಲು ನೀವು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಕೋಡ್ ಅನ್ನು ರನ್ ಮಾಡಬೇಕಾಗುತ್ತದೆ. ಇದರರ್ಥ ಈ ಕೋಡ್ ರೆಂಡರ್ ಬ್ಲಾಕಿಂಗ್ ಆಗುತ್ತದೆ. ವಾಸ್ತವವಾಗಿ, ಆ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಕೋಡ್ ರನ್ ಆಗುವವರೆಗೆ ಏನೂ ಕಾಣಿಸುವುದಿಲ್ಲ, ಅಥವಾ ವಸ್ತುಗಳು ಸರಿಯಾದ ಸ್ಥಳಗಳಲ್ಲಿ ಅಥವಾ ಸರಿಯಾದ ಗಾತ್ರದಲ್ಲಿ ಇರುವುದಿಲ್ಲ. ಮ್ಯಾಸನ್ರಿ ಲೇಔಟ್ ಅನ್ನು ಸಾಮಾನ್ಯವಾಗಿ ವೆಬ್ ಪುಟದ ಮುಖ್ಯ ಭಾಗಕ್ಕೆ ಬಳಸಲಾಗುತ್ತದೆ, ಇದರರ್ಥ ಕೋಡ್ ನಿಮ್ಮ ಮುಖ್ಯ ವಿಷಯವನ್ನು ಹೊಂದಿರುವುದಕ್ಕಿಂತ ನಂತರ ಗೋಚರಿಸುವಂತೆ ಮಾಡುತ್ತದೆ, ನಿಮ್ಮ LCP ಅಥವಾ ಅತಿದೊಡ್ಡ ಕಂಟೆಂಟ್‌ಫುಲ್ ಪೇಂಟ್ ಮೆಟ್ರಿಕ್ ಅನ್ನು ಕೆಡಿಸುತ್ತದೆ, ಇದು ಗ್ರಹಿಸಿದ ಕಾರ್ಯಕ್ಷಮತೆ ಮತ್ತು ಹುಡುಕಾಟ ಎಂಜಿನ್ ಆಪ್ಟಿಮೈಸೇಶನ್‌ನಲ್ಲಿ ದೊಡ್ಡ ಪಾತ್ರವನ್ನು ವಹಿಸುತ್ತದೆ. ನಾನು Masonry JS ಲೈಬ್ರರಿಯನ್ನು ಸರಳ ವಿನ್ಯಾಸದೊಂದಿಗೆ ಮತ್ತು DevTools ನಲ್ಲಿ ನಿಧಾನವಾದ 4G ಸಂಪರ್ಕವನ್ನು ಅನುಕರಿಸುವ ಮೂಲಕ ಪರೀಕ್ಷಿಸಿದೆ. ಲೈಬ್ರರಿಯು ತುಂಬಾ ದೊಡ್ಡದಲ್ಲ (24KB, 7.8KB ಜಿಜಿಪ್ಡ್), ಆದರೆ ನನ್ನ ಪರೀಕ್ಷಾ ಪರಿಸ್ಥಿತಿಗಳಲ್ಲಿ ಲೋಡ್ ಮಾಡಲು 600ms ತೆಗೆದುಕೊಂಡಿತು. ಮ್ಯಾಸನ್ರಿ ಲೈಬ್ರರಿಗಾಗಿ ದೀರ್ಘ 600ms ಲೋಡ್ ಸಮಯವನ್ನು ತೋರಿಸುವ ಕಾರ್ಯಕ್ಷಮತೆಯ ರೆಕಾರ್ಡಿಂಗ್ ಇಲ್ಲಿದೆ, ಮತ್ತು ಅದು ನಡೆಯುತ್ತಿರುವಾಗ ಯಾವುದೇ ರೆಂಡರಿಂಗ್ ಚಟುವಟಿಕೆ ನಡೆಯಲಿಲ್ಲ:

ಹೆಚ್ಚುವರಿಯಾಗಿ, ಆರಂಭಿಕ ಲೋಡ್ ಸಮಯದ ನಂತರ, ಡೌನ್‌ಲೋಡ್ ಮಾಡಿದ ಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಪಾರ್ಸ್ ಮಾಡಿ, ಕಂಪೈಲ್ ಮಾಡಿ ಮತ್ತು ನಂತರ ರನ್ ಮಾಡಬೇಕಾಗುತ್ತದೆ. ಇವೆಲ್ಲವೂ, ಮೊದಲೇ ಹೇಳಿದಂತೆ, ಪುಟದ ರೆಂಡರಿಂಗ್ ಅನ್ನು ನಿರ್ಬಂಧಿಸುತ್ತಿದೆ. ಬ್ರೌಸರ್‌ನಲ್ಲಿ ಅಂತರ್ನಿರ್ಮಿತ ಮ್ಯಾಸನ್ರಿ ಅನುಷ್ಠಾನದೊಂದಿಗೆ, ನಾವು ಲೋಡ್ ಮಾಡಲು ಮತ್ತು ರನ್ ಮಾಡಲು ಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಹೊಂದಿರುವುದಿಲ್ಲ. ಆರಂಭಿಕ ಪುಟ ರೆಂಡರಿಂಗ್ ಹಂತದಲ್ಲಿ ಬ್ರೌಸರ್ ಎಂಜಿನ್ ತನ್ನ ಕೆಲಸವನ್ನು ಮಾಡುತ್ತದೆ. ಉತ್ತಮ ಪ್ರತಿಕ್ರಿಯಾತ್ಮಕತೆ ಪುಟವು ಮೊದಲು ಲೋಡ್ ಆಗುವಂತೆಯೇ, ಬ್ರೌಸರ್ ವಿಂಡೋವನ್ನು ಮರುಗಾತ್ರಗೊಳಿಸುವುದರಿಂದ ಆ ಪುಟದಲ್ಲಿ ಲೇಔಟ್ ಅನ್ನು ಮತ್ತೆ ರೆಂಡರ್ ಮಾಡಲು ಕಾರಣವಾಗುತ್ತದೆ. ಈ ಹಂತದಲ್ಲಿ, ಆದಾಗ್ಯೂ, ಪುಟವು ಮ್ಯಾಸನ್ರಿ JS ಲೈಬ್ರರಿಯನ್ನು ಬಳಸುತ್ತಿದ್ದರೆ, ಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಮತ್ತೆ ಲೋಡ್ ಮಾಡುವ ಅಗತ್ಯವಿಲ್ಲ, ಏಕೆಂದರೆ ಅದು ಈಗಾಗಲೇಇಲ್ಲಿ. ಆದಾಗ್ಯೂ, ಸರಿಯಾದ ಸ್ಥಳಗಳಲ್ಲಿ ಐಟಂಗಳನ್ನು ಚಲಿಸುವ ಕೋಡ್ ಅನ್ನು ರನ್ ಮಾಡಬೇಕಾಗುತ್ತದೆ. ಈಗ ಈ ನಿರ್ದಿಷ್ಟ ಲೈಬ್ರರಿಯು ಪುಟವನ್ನು ಲೋಡ್ ಮಾಡಿದಾಗ ಇದನ್ನು ಮಾಡುವಲ್ಲಿ ಬಹಳ ವೇಗವಾಗಿದೆ ಎಂದು ತೋರುತ್ತದೆ. ಆದಾಗ್ಯೂ, ವಿಂಡೋ ಮರುಗಾತ್ರದ ಮೇಲೆ ಬೇರೆ ಸ್ಥಳಕ್ಕೆ ಚಲಿಸಬೇಕಾದಾಗ ಐಟಂಗಳನ್ನು ಅನಿಮೇಟ್ ಮಾಡುತ್ತದೆ ಮತ್ತು ಇದು ದೊಡ್ಡ ವ್ಯತ್ಯಾಸವನ್ನು ಮಾಡುತ್ತದೆ. ಸಹಜವಾಗಿ, ನಾವು ಡೆವಲಪರ್‌ಗಳು ಮಾಡುವಂತೆ ಬಳಕೆದಾರರು ತಮ್ಮ ಬ್ರೌಸರ್ ವಿಂಡೋಗಳನ್ನು ಮರುಗಾತ್ರಗೊಳಿಸಲು ಸಮಯವನ್ನು ಕಳೆಯುವುದಿಲ್ಲ. ಆದರೆ ಈ ಅನಿಮೇಟೆಡ್ ಮರುಗಾತ್ರಗೊಳಿಸುವಿಕೆಯ ಅನುಭವವು ಸಾಕಷ್ಟು ಜರ್ರಿಂಗ್ ಆಗಿರಬಹುದು ಮತ್ತು ಪುಟವು ಅದರ ಹೊಸ ಗಾತ್ರಕ್ಕೆ ಹೊಂದಿಕೊಳ್ಳಲು ತೆಗೆದುಕೊಳ್ಳುವ ಗ್ರಹಿಸಿದ ಸಮಯವನ್ನು ಸೇರಿಸುತ್ತದೆ. ಬಳಕೆಯ ಸುಲಭ ಮತ್ತು ಸರಳ ಕೋಡ್ ವೆಬ್ ವೈಶಿಷ್ಟ್ಯವನ್ನು ಬಳಸುವುದು ಎಷ್ಟು ಸುಲಭ ಮತ್ತು ಕೋಡ್ ಎಷ್ಟು ಸರಳವಾಗಿ ಕಾಣುತ್ತದೆ ಎಂಬುದು ನಿಮ್ಮ ತಂಡಕ್ಕೆ ದೊಡ್ಡ ವ್ಯತ್ಯಾಸವನ್ನು ಉಂಟುಮಾಡುವ ಪ್ರಮುಖ ಅಂಶಗಳಾಗಿವೆ. ಅವರು ಎಂದಿಗೂ ಅಂತಿಮ ಬಳಕೆದಾರರ ಅನುಭವದಂತೆ ಮುಖ್ಯವಾಗುವುದಿಲ್ಲ, ಆದರೆ ಡೆವಲಪರ್ ಅನುಭವವು ನಿರ್ವಹಣೆಯ ಮೇಲೆ ಪರಿಣಾಮ ಬೀರುತ್ತದೆ. ಅಂತರ್ನಿರ್ಮಿತ ವೆಬ್ ವೈಶಿಷ್ಟ್ಯವನ್ನು ಬಳಸುವುದು ಆ ಮುಂಭಾಗದಲ್ಲಿ ಪ್ರಮುಖ ಪ್ರಯೋಜನಗಳೊಂದಿಗೆ ಬರುತ್ತದೆ:

HTML, CSS ಮತ್ತು JS ಅನ್ನು ಈಗಾಗಲೇ ತಿಳಿದಿರುವ ಡೆವಲಪರ್‌ಗಳು ಆ ವೈಶಿಷ್ಟ್ಯವನ್ನು ಸುಲಭವಾಗಿ ಬಳಸಲು ಸಾಧ್ಯವಾಗುತ್ತದೆ ಏಕೆಂದರೆ ಇದನ್ನು ಉತ್ತಮವಾಗಿ ಸಂಯೋಜಿಸಲು ಮತ್ತು ಉಳಿದ ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್‌ನೊಂದಿಗೆ ಸ್ಥಿರವಾಗಿರಲು ವಿನ್ಯಾಸಗೊಳಿಸಲಾಗಿದೆ. ವೈಶಿಷ್ಟ್ಯವನ್ನು ಹೇಗೆ ಬಳಸಲಾಗಿದೆ ಎಂಬುದರಲ್ಲಿ ಪರಿಚಯಿಸಲಾದ ಬದಲಾವಣೆಗಳನ್ನು ಮುರಿಯುವ ಅಪಾಯವಿಲ್ಲ. ಆ ವೈಶಿಷ್ಟ್ಯವನ್ನು ಅಸಮ್ಮತಿಸುವ ಅಥವಾ ನಿರ್ವಹಿಸದಿರುವ ಅಪಾಯವು ಬಹುತೇಕ ಶೂನ್ಯವಾಗಿರುತ್ತದೆ.

ಬಿಲ್ಟ್-ಇನ್ ಮ್ಯಾಸನ್ರಿ ಸಂದರ್ಭದಲ್ಲಿ, ಇದು ಲೇಔಟ್ ಪ್ರಾಚೀನವಾಗಿರುವುದರಿಂದ, ನೀವು ಗ್ರಿಡ್ ಅಥವಾ ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್‌ನಂತೆ CSS ನಿಂದ ಬಳಸುತ್ತೀರಿ, ಯಾವುದೇ JS ಒಳಗೊಂಡಿಲ್ಲ. ಅಲ್ಲದೆ, ಗ್ಯಾಪ್‌ನಂತಹ ಇತರ ಲೇಔಟ್-ಸಂಬಂಧಿತ CSS ಗುಣಲಕ್ಷಣಗಳು ನೀವು ನಿರೀಕ್ಷಿಸಿದಂತೆ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತವೆ. ತಿಳಿದುಕೊಳ್ಳಲು ಯಾವುದೇ ತಂತ್ರಗಳು ಅಥವಾ ಪರಿಹಾರೋಪಾಯಗಳಿಲ್ಲ, ಮತ್ತು ನೀವು ಕಲಿಯುವ ವಿಷಯಗಳನ್ನು MDN ನಲ್ಲಿ ದಾಖಲಿಸಲಾಗಿದೆ. Masonry JS lib ಗಾಗಿ, ಪ್ರಾರಂಭವು ಸ್ವಲ್ಪ ಸಂಕೀರ್ಣವಾಗಿದೆ: ಇದು ಕಾಲಮ್ ಮತ್ತು ಅಂತರದ ಗಾತ್ರಗಳನ್ನು ಹೊಂದಿಸಲು ಗುಪ್ತ HTML ಅಂಶಗಳೊಂದಿಗೆ ನಿರ್ದಿಷ್ಟ ಸಿಂಟ್ಯಾಕ್ಸ್‌ನೊಂದಿಗೆ ಡೇಟಾ ಗುಣಲಕ್ಷಣದ ಅಗತ್ಯವಿದೆ. ಜೊತೆಗೆ, ನೀವು ಕಾಲಮ್‌ಗಳನ್ನು ವಿಸ್ತರಿಸಲು ಬಯಸಿದರೆ, ಸಮಸ್ಯೆಗಳನ್ನು ತಪ್ಪಿಸಲು ಅಂತರದ ಗಾತ್ರವನ್ನು ನೀವೇ ಸೇರಿಸಿಕೊಳ್ಳಬೇಕು:

<ಶೈಲಿ> .ಟ್ರ್ಯಾಕ್-ಸೈಜರ್, .ಐಟಂ { ಅಗಲ: 20%; } .ಗಟರ್-ಸೈಜರ್ { ಅಗಲ: 1 ರೆಮ್; } .ಐಟಂ { ಎತ್ತರ: 100px; ಮಾರ್ಜಿನ್-ಬ್ಲಾಕ್-ಎಂಡ್: 1ರೆಮ್; } .ಐಟಂ:ನೇ-ಮಗು(ಬೆಸ) { ಎತ್ತರ: 200px; } .item--width2 { ಅಗಲ: ಕ್ಯಾಲ್ಕ್ (40% + 1rem); }

...

ಅಂತರ್ನಿರ್ಮಿತ ಮ್ಯಾಸನ್ರಿ ಅನುಷ್ಠಾನವು ಹೇಗಿರುತ್ತದೆ ಎಂಬುದಕ್ಕೆ ಇದನ್ನು ಹೋಲಿಸೋಣ: <ಶೈಲಿ> .ಧಾರಕ { ಪ್ರದರ್ಶನ: ಗ್ರಿಡ್-ಲೇನ್ಸ್; ಗ್ರಿಡ್-ಲೇನ್‌ಗಳು: ಪುನರಾವರ್ತನೆ (4, 20%); ಅಂತರ: 1 ರೆಮ್; } .ಐಟಂ { ಎತ್ತರ: 100px; } .ಐಟಂ:ನೇ-ಮಗು(ಬೆಸ) { ಎತ್ತರ: 200px; } .item--width2 { ಗ್ರಿಡ್-ಕಾಲಮ್: ಸ್ಪ್ಯಾನ್ 2; }

...

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

ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಎಕ್ಸ್‌ಪ್ಲೋರರ್ ಸೈಟ್ ಅನ್ನು ಒಳಗೊಂಡಿದೆ: ನೀವು ಅದರ ಬಿಡುಗಡೆ ಟಿಪ್ಪಣಿಗಳ ಪುಟದಲ್ಲಿ ಆಸಕ್ತಿ ಹೊಂದಿರಬಹುದು. ಮತ್ತು, ನೀವು RSS ಅನ್ನು ಬಯಸಿದರೆ, ಬಿಡುಗಡೆ ಟಿಪ್ಪಣಿಗಳ ಫೀಡ್ ಅನ್ನು ಪರಿಶೀಲಿಸಿ, ಹಾಗೆಯೇ ಬೇಸ್‌ಲೈನ್ ಹೊಸದಾಗಿ ಲಭ್ಯವಿರುವ ಮತ್ತು ವ್ಯಾಪಕವಾಗಿ ಲಭ್ಯವಿರುವ ಫೀಡ್‌ಗಳನ್ನು ಪರಿಶೀಲಿಸಿ.

ವೆಬ್ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಸ್ಥಿತಿ ಡ್ಯಾಶ್‌ಬೋರ್ಡ್: ನೀವು ಅದರ ವಿವಿಧ ಬೇಸ್‌ಲೈನ್ ವರ್ಷದ ಪುಟಗಳನ್ನು ಇಷ್ಟಪಡಬಹುದು.

Chrome ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಸ್ಥಿತಿಯ ಮಾರ್ಗಸೂಚಿ ಪುಟ.

ನೀವು ಸ್ವಲ್ಪ ಹೆಚ್ಚು ಸಮಯವನ್ನು ಹೊಂದಿದ್ದರೆ, ನೀವು ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರ ಬಿಡುಗಡೆ ಟಿಪ್ಪಣಿಗಳಲ್ಲಿ ಆಸಕ್ತಿ ಹೊಂದಿರಬಹುದು:

ಕ್ರೋಮ್ ಎಡ್ಜ್ ಫೈರ್‌ಫಾಕ್ಸ್ ಸಫಾರಿ

ಇನ್ನೂ ಹೆಚ್ಚಿನ ಸಂಪನ್ಮೂಲಗಳಿಗಾಗಿ, ನನ್ನ ನ್ಯಾವಿಗೇಟಿಂಗ್ ದಿ ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಚೀಟ್‌ಶೀಟ್ ಅನ್ನು ಪರಿಶೀಲಿಸಿ. ನನ್ನ ವಿಷಯ ಇನ್ನೂ ಕಾರ್ಯಗತವಾಗಿಲ್ಲ ಅದು ಸಮಸ್ಯೆಯ ಇನ್ನೊಂದು ಬದಿ. ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಸಮಯ, ಶಕ್ತಿ ಮತ್ತು ಮಾರ್ಗಗಳನ್ನು ನೀವು ಕಂಡುಕೊಂಡರೂ ಸಹ, ನಿಮ್ಮ ಧ್ವನಿಯನ್ನು ಆಲಿಸಲು ಮತ್ತು ನಿಮ್ಮ ಮೆಚ್ಚಿನ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸಲು ಇನ್ನೂ ಹತಾಶೆ ಇರುತ್ತದೆ. ನಿರ್ದಿಷ್ಟ ದೋಷವನ್ನು ಪರಿಹರಿಸಲು ನೀವು ವರ್ಷಗಳಿಂದ ಕಾಯುತ್ತಿರಬಹುದು ಅಥವಾ ಬ್ರೌಸರ್‌ನಲ್ಲಿ ಇನ್ನೂ ಕಾಣೆಯಾಗಿರುವ ನಿರ್ದಿಷ್ಟ ವೈಶಿಷ್ಟ್ಯವನ್ನು ರವಾನಿಸಬಹುದು. ನಾನು ಹೇಳುವುದೇನೆಂದರೆ ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರು ಕೇಳುತ್ತಾರೆ. ನಾನು ಹಲವಾರು ಕ್ರಾಸ್-ಆರ್ಗನೈಸೇಶನ್ ತಂಡಗಳ ಭಾಗವಾಗಿದ್ದೇನೆ, ಅಲ್ಲಿ ನಾವು ಡೆವಲಪರ್ ಸಿಗ್ನಲ್‌ಗಳು ಮತ್ತು ಪ್ರತಿಕ್ರಿಯೆಯನ್ನು ಸಾರ್ವಕಾಲಿಕವಾಗಿ ಚರ್ಚಿಸುತ್ತೇವೆ. ಪ್ರತಿ ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರಲ್ಲಿ ಆಂತರಿಕ ಮತ್ತು ಫೋರಮ್‌ಗಳು, ಓಪನ್ ಸೋರ್ಸ್ ಪ್ರಾಜೆಕ್ಟ್‌ಗಳು, ಬ್ಲಾಗ್‌ಗಳು ಮತ್ತು ಸಮೀಕ್ಷೆಗಳಲ್ಲಿ ಬಾಹ್ಯ/ಸಾರ್ವಜನಿಕ ಎರಡೂ ಪ್ರತಿಕ್ರಿಯೆಯ ವಿವಿಧ ಮೂಲಗಳನ್ನು ನಾವು ನೋಡುತ್ತೇವೆ. ಮತ್ತು, ಡೆವಲಪರ್‌ಗಳಿಗೆ ತಮ್ಮ ನಿರ್ದಿಷ್ಟ ಅಗತ್ಯಗಳನ್ನು ಹಂಚಿಕೊಳ್ಳಲು ಮತ್ತು ಪ್ರಕರಣಗಳನ್ನು ಬಳಸಲು ನಾವು ಯಾವಾಗಲೂ ಉತ್ತಮ ಮಾರ್ಗಗಳನ್ನು ರಚಿಸಲು ಪ್ರಯತ್ನಿಸುತ್ತಿದ್ದೇವೆ. ಆದ್ದರಿಂದ, ನಿಮಗೆ ಸಾಧ್ಯವಾದರೆ, ದಯವಿಟ್ಟು ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರಿಂದ ಹೆಚ್ಚಿನದನ್ನು ಬೇಡಿಕೊಳ್ಳಿ ಮತ್ತು ನಿಮಗೆ ಅಗತ್ಯವಿರುವ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸಲು ನಮಗೆ ಒತ್ತಡ ಹಾಕಿ. ಇದು ಸಮಯ ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ ಎಂದು ನಾನು ಅರ್ಥಮಾಡಿಕೊಂಡಿದ್ದೇನೆ ಮತ್ತು ಬೆದರಿಸಬಹುದು (ಪ್ರವೇಶಕ್ಕೆ ಹೆಚ್ಚಿನ ತಡೆಗೋಡೆಯನ್ನು ನಮೂದಿಸಬಾರದು), ಆದರೆ ಇದು ಕೆಲಸ ಮಾಡುತ್ತದೆ. ನಿಮ್ಮ (ಅಥವಾ ನಿಮ್ಮ ಕಂಪನಿಯ) ಧ್ವನಿಯನ್ನು ನೀವು ಕೇಳಬಹುದಾದ ಕೆಲವು ವಿಧಾನಗಳು ಇಲ್ಲಿವೆ: ವಾರ್ಷಿಕ JS ರಾಜ್ಯ, CSS ರಾಜ್ಯ ಮತ್ತು HTML ಸಮೀಕ್ಷೆಗಳ ಸ್ಥಿತಿಯನ್ನು ತೆಗೆದುಕೊಳ್ಳಿ. ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರು ತಮ್ಮ ಕೆಲಸಕ್ಕೆ ಹೇಗೆ ಆದ್ಯತೆ ನೀಡುತ್ತಾರೆ ಎಂಬುದರಲ್ಲಿ ಅವರು ದೊಡ್ಡ ಪಾತ್ರವನ್ನು ವಹಿಸುತ್ತಾರೆ. ಬ್ರೌಸರ್‌ಗಳಾದ್ಯಂತ ಸ್ಥಿರವಾಗಿ ಕಾರ್ಯಗತಗೊಳಿಸಲು ನಿಮಗೆ ನಿರ್ದಿಷ್ಟ ಪ್ರಮಾಣಿತ-ಆಧಾರಿತ API ಅಗತ್ಯವಿದ್ದರೆ, ಮುಂದಿನ ಇಂಟರಾಪ್ ಪ್ರಾಜೆಕ್ಟ್ ಪುನರಾವರ್ತನೆಯಲ್ಲಿ ಪ್ರಸ್ತಾಪವನ್ನು ಸಲ್ಲಿಸುವುದನ್ನು ಪರಿಗಣಿಸಿ. ಇದಕ್ಕೆ ಹೆಚ್ಚಿನ ಸಮಯ ಬೇಕಾಗುತ್ತದೆ, ಆದರೆ Shopify ಮತ್ತು RUMvision ಇಂಟರ್ಯಾಪ್ 2026 ಗಾಗಿ ತಮ್ಮ ಇಚ್ಛೆಯ ಪಟ್ಟಿಗಳನ್ನು ಹೇಗೆ ಹಂಚಿಕೊಂಡಿದೆ ಎಂಬುದನ್ನು ಪರಿಗಣಿಸಿ. ಈ ರೀತಿಯ ವಿವರವಾದ ಮಾಹಿತಿಯು ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರಿಗೆ ಆದ್ಯತೆ ನೀಡಲು ತುಂಬಾ ಉಪಯುಕ್ತವಾಗಿದೆ. ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರ ಮೇಲೆ ಪ್ರಭಾವ ಬೀರಲು ಹೆಚ್ಚು ಉಪಯುಕ್ತ ಲಿಂಕ್‌ಗಳಿಗಾಗಿ, ನನ್ನ ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಚೀಟ್‌ಶೀಟ್ ನ್ಯಾವಿಗೇಟಿಂಗ್ ಅನ್ನು ಪರಿಶೀಲಿಸಿ. ತೀರ್ಮಾನ ಮುಚ್ಚಲು, ಈ ಲೇಖನವು ನಿಮಗೆ ಯೋಚಿಸಲು ಕೆಲವು ವಿಷಯಗಳನ್ನು ಬಿಟ್ಟುಕೊಟ್ಟಿದೆ ಎಂದು ನಾನು ಭಾವಿಸುತ್ತೇನೆ:

ಮ್ಯಾಸನ್ರಿ ಮತ್ತು ಇತರ ಮುಂಬರುವ ವೆಬ್ ವೈಶಿಷ್ಟ್ಯಗಳಿಗಾಗಿ ಉತ್ಸಾಹ. ನೀವು ಬಳಸಲು ಪ್ರಾರಂಭಿಸಲು ಬಯಸುವ ಕೆಲವು ವೆಬ್ ವೈಶಿಷ್ಟ್ಯಗಳು. ಅಂತರ್ನಿರ್ಮಿತ ವೈಶಿಷ್ಟ್ಯಗಳ ಪರವಾಗಿ ನೀವು ಕೆಲವು ಕಸ್ಟಮ್ ಅಥವಾ 3 ನೇ ವ್ಯಕ್ತಿಯ ಕೋಡ್ ಅನ್ನು ತೆಗೆದುಹಾಕಲು ಸಾಧ್ಯವಾಗಬಹುದು. ಏನಾಗುತ್ತಿದೆ ಎಂಬುದನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಮತ್ತು ಬ್ರೌಸರ್ ಮಾರಾಟಗಾರರ ಮೇಲೆ ಪ್ರಭಾವ ಬೀರಲು ಕೆಲವು ಮಾರ್ಗಗಳು.

ಹೆಚ್ಚು ಮುಖ್ಯವಾಗಿ, ವೆಬ್ ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ಅನ್ನು ಅದರ ಪೂರ್ಣ ಸಾಮರ್ಥ್ಯಕ್ಕೆ ಬಳಸುವ ಪ್ರಯೋಜನಗಳ ಬಗ್ಗೆ ನಾನು ನಿಮಗೆ ಮನವರಿಕೆ ಮಾಡಿದ್ದೇನೆ ಎಂದು ನಾನು ಭಾವಿಸುತ್ತೇನೆ.

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free