🛠️

Whiz Tools

Build • Create • Innovate

ಬೇಸ್64 ಚಿತ್ರ ಡಿಕೋಡರ್ ಮತ್ತು ವೀಕ್ಷಕ | ಬೇಸ್64 ಅನ್ನು ಚಿತ್ರಗಳಿಗೆ ಪರಿವರ್ತಿಸಿ

ತಕ್ಷಣವೇ ಬೇಸ್64-ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರ ಶ್ರೇಣಿಗಳನ್ನು ಡಿಕೋಡ್ ಮತ್ತು ಪೂರ್ವದೃಶ್ಯವನ್ನು ವೀಕ್ಷಿಸಿ. ಅಮಾನ್ಯ ಇನ್ಪುಟ್‌ಗಳಿಗೆ ದೋಷ ನಿರ್ವಹಣೆಯನ್ನು ಬೆಂಬಲಿಸುತ್ತದೆ, JPEG, PNG, GIF ಮತ್ತು ಇತರ ಸಾಮಾನ್ಯ ಸ್ವರೂಪಗಳನ್ನು ಒಳಗೊಂಡಿದೆ.

ಬೇಸ್64 ಚಿತ್ರ ಡಿಕೋಡರ್ ಮತ್ತು ವೀಕ್ಷಕ

ಬೇಸ್64-ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರ ಶ್ರೇಣಿಯನ್ನು ಅಂಟಿಸಿ ಮತ್ತು ಚಿತ್ರವನ್ನು ವೀಕ್ಷಿಸಲು ಡಿಕೋಡ್ ಮಾಡಿ.

ಚಿತ್ರದ ಪೂರ್ವದೃಶ್ಯ

ಪ್ರದರ್ಶಿಸಲು ಯಾವುದೇ ಚಿತ್ರವಿಲ್ಲ. ಅದನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಡಿಕೋಡ್ ಮಾಡಲು ಬೇಸ್64 ಶ್ರೇಣಿಯನ್ನು ಅಂಟಿಸಿ.

JPEG, PNG, GIF ಮತ್ತು ಇತರ ಸಾಮಾನ್ಯ ಚಿತ್ರ ಫಾರ್ಮಾಟ್‌ಗಳನ್ನು ಬೆಂಬಲಿಸುತ್ತದೆ.

ದಿಕ್ಕುಗಳು

1. ಮೇಲಿನ ಪಠ್ಯ ಪ್ರದೇಶದಲ್ಲಿ ಬೇಸ್64-ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರ ಶ್ರೇಣಿಯನ್ನು ಅಂಟಿಸಿ.

2. ನೀವು ಟೈಪ್ ಮಾಡುವಾಗ ಚಿತ್ರವು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಡಿಕೋಡ್ ಆಗುತ್ತದೆ, ಅಥವಾ 'ಚಿತ್ರವನ್ನು ಡಿಕೋಡ್ ಮಾಡಿ' ಬಟನ್ ಅನ್ನು ಕ್ಲಿಕ್ ಮಾಡಿ.

3. ಡಿಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರವು ಕೆಳಗಿನ ಪೂರ್ವದೃಶ್ಯ ಪ್ರದೇಶದಲ್ಲಿ ಕಾಣಿಸುತ್ತದೆ.

ಗಮನಿಸಿ: ಉತ್ತಮ ಫಲಿತಾಂಶಗಳಿಗಾಗಿ ಶ್ರೇಣಿಯು 'data:image/' ನಿಂದ ಪ್ರಾರಂಭವಾಗಬೇಕು, ಆದರೆ ಈ ಪೂರ್ವಪದವಿಲ್ಲದ ಶ್ರೇಣಿಗಳನ್ನು ಡಿಕೋಡ್ ಮಾಡಲು ಈ ಸಾಧನ ಪ್ರಯತ್ನಿಸುತ್ತದೆ.

📚

ದಾಖಲೆ

Base64 ಚಿತ್ರ ಡಿಕೋಡರ್ ಮತ್ತು ವೀಕ್ಷಕ

ಪರಿಚಯ

Base64 ಒಂದು ಬೈನರಿ-ಗೆ-ಪಠ್ಯ ಎನ್‌ಕೋಡಿಂಗ್ ವ್ಯವಸ್ಥೆ ಆಗಿದ್ದು, ಬೈನರಿ ಡೇಟಾವನ್ನು ASCII ಸ್ಟ್ರಿಂಗ್ ಫಾರ್ಮಾಟ್‌ನಲ್ಲಿ ಪ್ರತಿನಿಧಿಸುತ್ತದೆ. ಇದು ಸಾಮಾನ್ಯವಾಗಿ HTML, CSS, JavaScript, JSON ಮತ್ತು ಇತರ ಪಠ್ಯಾಧಾರಿತ ಫಾರ್ಮಾಟ್‌ಗಳಲ್ಲಿ ಚಿತ್ರ ಡೇಟಾವನ್ನು ನೇರವಾಗಿ ಒಳಗೊಂಡಂತೆ ಬಳಸಲಾಗುತ್ತದೆ, ಅಲ್ಲಿ ಬೈನರಿ ಡೇಟಾವನ್ನು ನೇರವಾಗಿ ಸೇರಿಸಲು ಸಾಧ್ಯವಿಲ್ಲ. ಈ ಸಾಧನವು ನೀವು base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರ ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಡಿಕೋಡ್ ಮಾಡಲು ಮತ್ತು ಫಲಿತಾಂಶವಾಗಿ ಬಂದ ಚಿತ್ರಗಳನ್ನು ನೇರವಾಗಿ ನಿಮ್ಮ ಬ್ರೌಸರ್‌ನಲ್ಲಿ ವೀಕ್ಷಿಸಲು ಅನುಮತಿಸುತ್ತದೆ.

Base64 ಎನ್‌ಕೋಡಿಂಗ್ ಮೂಲ ಬೈನರಿ ಹೋಲಿಸಿದಾಗ ಡೇಟಾ ಗಾತ್ರವನ್ನು ಸುಮಾರು 33% ಹೆಚ್ಚಿಸುತ್ತದೆ, ಆದರೆ ಇದು ಚಿತ್ರಗಳನ್ನು ಪಠ್ಯಾಧಾರಿತ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳಲ್ಲಿ ನೇರವಾಗಿ ಸೇರಿಸಲು ಸಾಧ್ಯವಾಗಿಸುತ್ತದೆ, ಇದರಿಂದ ಪ್ರತ್ಯೇಕ ಫೈಲ್ ಡೌನ್‌ಲೋಡ್‌ಗಳನ್ನು ಅಗತ್ಯವಿಲ್ಲ. ಇದು ಐಕಾನ್‌ಗಳು, ಲೋಗೋಗಳು ಅಥವಾ ಸರಳ ಗ್ರಾಫಿಕ್‌ಗಳು ಹೀಗಿರುವಾಗ, ಒಳಗೊಂಡಿರುವ ಸುಲಭತೆಯನ್ನು ಗಾತ್ರದ ಹೆಚ್ಚಳಕ್ಕಿಂತ ಹೆಚ್ಚು ಒತ್ತಿಸುತ್ತದೆ.

ನಮ್ಮ Base64 ಚಿತ್ರ ಡಿಕೋಡರ್ ಸಾಧನವು ನೀವು base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರ ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಪೇಸ್ಟ್ ಮಾಡಲು ಮತ್ತು ತಕ್ಷಣವೇ ಡಿಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರವನ್ನು ನೋಡಲು ಸರಳ ಇಂಟರ್ಫೇಸ್ ಅನ್ನು ಒದಗಿಸುತ್ತದೆ. ಇದು JPEG, PNG, GIF, WebP ಮತ್ತು SVG ಸೇರಿದಂತೆ ಎಲ್ಲಾ ಸಾಮಾನ್ಯ ಚಿತ್ರ ಫಾರ್ಮಾಟ್‌ಗಳನ್ನು ಬೆಂಬಲಿಸುತ್ತದೆ ಮತ್ತು ಡೇಟಾ URL ಫಾರ್ಮಾಟ್ ( data:image/... ಪೂರ್ವಭಾಗ) ಮತ್ತು ಕಚ್ಚಾ base64 ಸ್ಟ್ರಿಂಗ್‌ಗಳನ್ನು ನಿರ್ವಹಿಸಬಹುದು.

ತಾಂತ್ರಿಕ ವಿವರಗಳು

Base64 ಎನ್‌ಕೋಡಿಂಗ್ ಫಾರ್ಮಾಟ್

Base64 ಎನ್‌ಕೋಡಿಂಗ್ ಬೈನರಿ ಡೇಟಾವನ್ನು 64 ASCII ಅಕ್ಷರಗಳಿಗೆ (A-Z, a-z, 0-9, +, ಮತ್ತು /) ಪರಿವರ್ತಿಸುತ್ತದೆ, = ಅನ್ನು ಪ್ಯಾಡಿಂಗ್‌ಗಾಗಿ ಬಳಸಲಾಗುತ್ತದೆ. ವೆಬ್‌ನಲ್ಲಿ ಚಿತ್ರಗಳಿಗೆ, base64 ಡೇಟಾ ಸಾಮಾನ್ಯವಾಗಿ ಕೆಳಗಿನ ರಚನೆಯೊಂದಿಗೆ ಡೇಟಾ URL ರೂಪದಲ್ಲಿ ರೂಪಾಂತರಗೊಳ್ಳುತ್ತದೆ:

1data:[<ಮೀಡಿಯಾ ಪ್ರಕಾರ>][;base64],<ಡೇಟಾ>
2

ಉದಾಹರಣೆಗೆ, base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ PNG ಚಿತ್ರವು ಹೀಗಿರಬಹುದು:

1data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==
2

ಈ ಫಾರ್ಮಾಟ್‌ನ ಅಂಶಗಳು:

  • data: - URL ಯೋಜನೆ
  • image/png - ಡೇಟಾದ MIME ಪ್ರಕಾರ
  • ;base64 - ಎನ್‌ಕೋಡಿಂಗ್ ವಿಧಾನ
  • , - ಶೀರ್ಷಿಕೆ ಮತ್ತು ಡೇಟಾದ ನಡುವಿನ ವಿಭಜಕ
  • ವಾಸ್ತವ base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಡೇಟಾ

ಡಿಕೋಡಿಂಗ್ ಪ್ರಕ್ರಿಯೆ

base64 ಚಿತ್ರ ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಡಿಕೋಡ್ ಮಾಡುವಾಗ, ಈ ಕೆಳಗಿನ ಹಂತಗಳು ನಡೆಯುತ್ತವೆ:

  1. ಡೇಟಾ URL ಪೂರ್ವಭಾಗವನ್ನು ಒಳಗೊಂಡಿದೆ ಎಂದು ಗುರುತಿಸಲು ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಪಾರ್ಸ್ ಮಾಡಲಾಗುತ್ತದೆ
  2. ಪೂರ್ವಭಾಗವಿದ್ದರೆ, ಚಿತ್ರ ರೂಪವನ್ನು ನಿರ್ಧರಿಸಲು MIME ಪ್ರಕಾರವನ್ನು ತೆಗೆದುಕೊಳ್ಳಲಾಗುತ್ತದೆ
  3. base64 ಡೇಟಾ ಭಾಗವನ್ನು ಪ್ರತ್ಯೇಕಿಸಲಾಗುತ್ತದೆ ಮತ್ತು ಬೈನರಿ ಡೇಟಾಗೆ ಡಿಕೋಡ್ ಮಾಡಲಾಗುತ್ತದೆ
  4. ಬೈನರಿ ಡೇಟಾ ಚಿತ್ರವಾಗಿ ಪ್ರದರ್ಶಿಸಲು ಬ್ಲಾಬ್ ಅಥವಾ ವಸ್ತು URL ಗೆ ಪರಿವರ್ತಿತವಾಗುತ್ತದೆ

ನಿಮ್ಮ ಇನ್ಪುಟ್ ಡೇಟಾ URL ಪೂರ್ವಭಾಗವನ್ನು ಒಳಗೊಂಡಿಲ್ಲದಿದ್ದರೆ, ಡಿಕೋಡರ್ ಅದನ್ನು ಕಚ್ಚಾ base64 ಡೇಟಾ ಎಂದು ಪರಿಗಣಿಸಲು ಪ್ರಯತ್ನಿಸುತ್ತದೆ ಮತ್ತು ಡಿಕೋಡ್ ಮಾಡಿದ ಬೈನರಿ ಹೆಡರ್ ಅಥವಾ ಡೀಫಾಲ್ಟ್ ಅನ್ನು PNG ಗೆ ಚಿತ್ರ ಪ್ರಕಾರವನ್ನು ಊಹಿಸುತ್ತದೆ.

ಬೆಂಬಲಿತ ಚಿತ್ರ ಫಾರ್ಮಾಟ್‌ಗಳು

ಈ ಸಾಧನವು ಎಲ್ಲಾ ಸಾಮಾನ್ಯ ವೆಬ್ ಚಿತ್ರ ಫಾರ್ಮಾಟ್‌ಗಳನ್ನು ಬೆಂಬಲಿಸುತ್ತದೆ:

ಫಾರ್ಮಾಟ್MIME ಪ್ರಕಾರಸಾಮಾನ್ಯ ಬಳಕೆ ಪ್ರಕರಣಗಳು
JPEGimage/jpegಫೋಟೋಗಳು, ಹಲವಾರು ಬಣ್ಣಗಳೊಂದಿಗೆ ಸಂಕೀರ್ಣ ಚಿತ್ರಗಳು
PNGimage/pngಪಾರದರ್ಶಕತೆಯನ್ನು ಅಗತ್ಯವಿರುವ ಚಿತ್ರಗಳು, ಸ್ಕ್ರೀನ್‌ಶಾಟ್‌ಗಳು, ಗ್ರಾಫಿಕ್‌ಗಳು
GIFimage/gifಸರಳ ಅನಿಮೇಶನ್‌ಗಳು, ನಿರ್ದಿಷ್ಟ ಬಣ್ಣದ ಚಿತ್ರಗಳು
WebPimage/webpJPEG/PNG ಗೆ ಹೋಲಿಸಿದಾಗ ಉತ್ತಮ ಸಂಕೋಚನವನ್ನು ಒದಗಿಸುವ ಆಧುನಿಕ ರೂಪ
SVGimage/svg+xmlವೆಕ್ಟರ್ ಗ್ರಾಫಿಕ್‌ಗಳು, ವಿಸ್ತರಣೀಯ ಐಕಾನ್‌ಗಳು ಮತ್ತು ಚಿತ್ರಣಗಳು

ಬಳಕೆ ಪ್ರಕರಣಗಳು

Base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರಗಳಿಗೆ ವೆಬ್ ಅಭಿವೃದ್ಧಿ ಮತ್ತು ಇತರ ಕ್ಷೇತ್ರಗಳಲ್ಲಿ ಹಲವಾರು ಉಪಯೋಗಗಳು ಇವೆ:

  1. HTML/CSS/JS ನಲ್ಲಿ ಚಿತ್ರಗಳನ್ನು ಒಳಗೊಂಡಂತೆ: ಸಣ್ಣ ಚಿತ್ರಗಳನ್ನು ನೇರವಾಗಿ ನಿಮ್ಮ ಕೋಡ್‌ನಲ್ಲಿ ಸೇರಿಸುವ ಮೂಲಕ HTTP ವಿನಂತಿಗಳನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ, ಇದು ಪುಟದ ಲೋಡ್ ಸಮಯವನ್ನು ಸುಧಾರಿಸುತ್ತದೆ.

  2. ಇಮೇಲ್ ಟೆಂಪ್ಲೇಟುಗಳು: ಹೊರಗಿನ ಚಿತ್ರಗಳನ್ನು ಡೀಫಾಲ್ಟ್‌ಗಾಗಿ ಅಡ್ಡಗೋಚಿಸುತ್ತಿರುವ ಇಮೇಲ್ ಕ್ಲೈಂಟ್‌ಗಳಲ್ಲಿ ಚಿತ್ರಗಳು ಸರಿಯಾಗಿ ಪ್ರದರ್ಶಿತವಾಗಲು ಖಚಿತಪಡಿಸುತ್ತದೆ.

  3. ಒಂದು ಫೈಲ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳು: ಎಲ್ಲಾ ಸಂಪತ್ತುಗಳನ್ನು ಒಬ್ಬೇ ಫೈಲ್‌ನಲ್ಲಿ ಒಳಗೊಂಡಂತೆ ಸ್ವಾಯತ್ತ HTML ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ರಚಿಸುತ್ತದೆ.

  4. API ಪ್ರತಿಸ್ಪಂದನೆಗಳು: ಪ್ರತ್ಯೇಕ ಚಿತ್ರ ಎಂಡ್ಪಾಯಿಂಟ್‌ಗಳನ್ನು ಅಗತ್ಯವಿಲ್ಲದೆ JSON ಪ್ರತಿಸ್ಪಂದನೆಗಳಲ್ಲಿ ನೇರವಾಗಿ ಚಿತ್ರ ಡೇಟಾವನ್ನು ಒಳಗೊಂಡಂತೆ.

  5. CSS ನಲ್ಲಿ ಡೇಟಾ URIs: ನೇರವಾಗಿ CSS ಫೈಲ್‌ಗಳಲ್ಲಿ ಸಣ್ಣ ಐಕಾನ್‌ಗಳು ಮತ್ತು ಹಿನ್ನೆಲೆ ಚಿತ್ರಗಳನ್ನು ಒಳಗೊಂಡಂತೆ.

  6. ಕ್ಯಾನ್ವಾಸ್ ಮ್ಯಾನಿಪ್ಯುಲೇಶನ್‌ಗಳು: ಕ್ಯಾನ್ವಾಸ್ ಚಿತ್ರ ಡೇಟಾವನ್ನು ಉಳಿಸಲು ಮತ್ತು ವರ್ಗಾಯಿಸಲು ಸುಲಭವಾಗುತ್ತದೆ.

  7. ಆಫ್‌ಲೈನ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳು: localStorage ಅಥವಾ IndexedDB ನಲ್ಲಿ ಚಿತ್ರಗಳನ್ನು ಪಠ್ಯ ಸ್ಟ್ರಿಂಗ್‌ಗಳಂತೆ ಸಂಗ್ರಹಿಸುತ್ತದೆ.

ಕಾರ್ಯಕ್ಷಮತೆ ಪರಿಗಣನೆಗಳು

Base64 ಎನ್‌ಕೋಡಿಂಗ್ ಸುಲಭತೆಯನ್ನು ಒದಗಿಸುತ್ತಿರುವಾಗ, ಇದು ವ್ಯಾಪಾರಗಳೊಂದಿಗೆ ಬರುತ್ತದೆ:

  • ಗಾತ್ರದ ಹೆಚ್ಚಳ: Base64 ಎನ್‌ಕೋಡಿಂಗ್ ಡೇಟಾ ಗಾತ್ರವನ್ನು ಸುಮಾರು 33% ಹೆಚ್ಚಿಸುತ್ತದೆ.
  • ಬ್ರೌಸರ್ ಕ್ಯಾಶಿಂಗ್ ಇಲ್ಲ: ಒಳಗೊಂಡ ಚಿತ್ರಗಳನ್ನು ಪ್ರತ್ಯೇಕವಾಗಿ ಕ್ಯಾಶ್ ಮಾಡಲಾಗುವುದಿಲ್ಲ.
  • ಪಾರ್ಸಿಂಗ್ ಓವರಹೆಡ್: ಬ್ರೌಸರ್‌ಗಳು ಡಿಕೋಡ್ ಮಾಡಲು base64 ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಬಳಸಬೇಕು.
  • ನಿರ್ವಹಣಾ ಸವಾಲುಗಳು: ಒಳಗೊಂಡ ಚಿತ್ರಗಳನ್ನು ಅಪ್ಡೇಟ್ ಮಾಡುವುದು ಉಲ್ಲೇಖಿತ ಫೈಲ್‌ಗಳಿಗೆ ಹೋಲಿಸಿದರೆ ಕಷ್ಟಕರವಾಗಿದೆ.

ಅತ್ಯುತ್ತಮ ಕಾರ್ಯಕ್ಷಮತೆಗಾಗಿ, base64 ಎನ್‌ಕೋಡಿಂಗ್ ಸಾಮಾನ್ಯವಾಗಿ ಸಣ್ಣ ಚಿತ್ರಗಳಿಗೆ (10KB ಕ್ಕಿಂತ ಕಡಿಮೆ) ಮಾತ್ರ ಶಿಫಾರಸು ಮಾಡಲಾಗುತ್ತದೆ. ದೊಡ್ಡ ಚಿತ್ರಗಳನ್ನು ಸಾಮಾನ್ಯವಾಗಿ ಪ್ರತ್ಯೇಕ ಫೈಲ್‌ಗಳಂತೆ ಉತ್ತಮವಾಗಿ ಸೇವಿಸಲಾಗುತ್ತದೆ, ಅವುಗಳನ್ನು ಸರಿಯಾಗಿ ಕ್ಯಾಶ್ ಮತ್ತು ಆಪ್ಟಿಮೈಸ್ ಮಾಡಬಹುದು.

ಪರ್ಯಾಯಗಳು

ವಿಭಿನ್ನ ಬಳಕೆ ಪ್ರಕರಣಗಳಿಗೆ base64 ಎನ್‌ಕೋಡಿಂಗ್‌ಗೆ ಹಲವಾರು ಪರ್ಯಾಯಗಳು ಇವೆ:

  1. SVG ಇನ್‌ಲೈನ್ ಅಳವಡಿಕೆ: ವೆಕ್ಟರ್ ಗ್ರಾಫಿಕ್‌ಗಳಿಗೆ, ಇನ್‌ಲೈನ್ SVG ಸಾಮಾನ್ಯವಾಗಿ base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ SVG ಗೆ ಹೋಲಿಸಿದಾಗ ಉತ್ತಮ ಕಾರ್ಯಕ್ಷಮತೆ ಮತ್ತು ಲವಚಿಕತೆಯನ್ನು ಒದಗಿಸುತ್ತದೆ.

  2. WebP ಮತ್ತು ಆಧುನಿಕ ಚಿತ್ರ ರೂಪಗಳು: ಇವು base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ JPEG/PNG ಗೆ ಹೋಲಿಸಿದಾಗ ಉತ್ತಮ ಸಂಕೋಚನವನ್ನು ಒದಗಿಸುತ್ತವೆ.

  3. ಚಿತ್ರ ಸ್ಪ್ರೈಟ್‌ಗಳು: CSS ಸ್ಥಾನವನ್ನು ಬಳಸಿಕೊಂಡು ಬಹು ಸಣ್ಣ ಚಿತ್ರಗಳನ್ನು ಒಬ್ಬೇ ಫೈಲ್‌ನಲ್ಲಿ ಸೇರಿಸುವುದು.

  4. CDN (ಕಂಟೆಂಟ್ ಡೆಲಿವರಿ ನೆಟ್ವರ್ಕ್‌ಗಳು): ಉತ್ಪಾದನಾ ಸ್ಥಳಗಳಿಗೆ, ಆಪ್ಟಿಮೈಸ್ ಮಾಡಿದ ಚಿತ್ರಗಳನ್ನು CDN ನಿಂದ ಸೇವಿಸುವುದು ಸಾಮಾನ್ಯವಾಗಿ ಹೆಚ್ಚು ಪರಿಣಾಮಕಾರಿ.

  5. ಡೇಟಾ ಸಂಕೋಚನ: ದೊಡ್ಡ ಪ್ರಮಾಣದ ಬೈನರಿ ಡೇಟಾವನ್ನು ವರ್ಗಾಯಿಸಲು, gzip ಅಥವಾ Brotliಂತಹ ವಿಶೇಷ ಸಂಕೋಚನ ಅಲ್ಗಾರಿದಮ್‌ಗಳು base64 ಕ್ಕಿಂತ ಹೆಚ್ಚು ಪರಿಣಾಮಕಾರಿ.

ಕೋಡ್ ಉದಾಹರಣೆಗಳು

ಇಲ್ಲಿ ವಿವಿಧ ಕಾರ್ಯಕ್ರಮ ಭಾಷೆಗಳಲ್ಲಿ base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರಗಳೊಂದಿಗೆ ಕೆಲಸ ಮಾಡುವ ಉದಾಹರಣೆಗಳು ಇಲ್ಲಿವೆ:

1// JavaScript (ಬ್ರೌಸರ್) ನಲ್ಲಿ ಚಿತ್ರವನ್ನು base64 ಗೆ ಪರಿವರ್ತಿಸಲು
2function imageToBase64(imgElement) {
3  const canvas = document.createElement('canvas');
4  canvas.width = imgElement.width;
5  canvas.height = imgElement.height;
6  
7  const ctx = canvas.getContext('2d');
8  ctx.drawImage(imgElement, 0, 0);
9  
10  // ಡೇಟಾ URL (base64 ಸ್ಟ್ರಿಂಗ್) ಯಂತೆ ಪಡೆಯಿರಿ
11  return canvas.toDataURL('image/png');
12}
13
14// base64 ಚಿತ್ರವನ್ನು ಪ್ರದರ್ಶಿಸಲು
15function displayBase64Image(base64String) {
16  const img = new Image();
17  
18  // ಡೇಟಾ URL ಪೂರ್ವಭಾಗವನ್ನು ಒಳಗೊಂಡಿಲ್ಲದ ಸ್ಟ್ರಿಂಗ್‌ಗಳನ್ನು ನಿರ್ವಹಿಸಿ
19  if (!base64String.startsWith('data:')) {
20    base64String = `data:image/png;base64,${base64String}`;
21  }
22  
23  img.src = base64String;
24  document.body.appendChild(img);
25}
26

HTML ಕಾರ್ಯಗತಗೊಳಣೆ

ಇಲ್ಲಿ base64 ಚಿತ್ರವನ್ನು ನೇರವಾಗಿ HTML ನಲ್ಲಿ ಒಳಗೊಂಡಂತೆ ಹೇಗೆ:

1<!-- HTML ನಲ್ಲಿ base64 ಚಿತ್ರವನ್ನು ನೇರವಾಗಿ ಒಳಗೊಂಡಂತೆ -->
2<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Base64 ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರ">
3
4<!-- base64 ಹಿನ್ನೆಲೆ ಚಿತ್ರವನ್ನು ಬಳಸುವ CSS -->
5<style>
6.base64-bg {
7  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==');
8  width: 100px;
9  height: 100px;
10}
11</style>
12<div class="base64-bg"></div>
13

ಇತಿಹಾಸ

Base64 ಎನ್‌ಕೋಡಿಂಗ್ 1970 ರ ದಶಕದಲ್ಲಿ ಇಲೆಕ್ಟ್ರಾನಿಕ್ ಮೇಲ್ ವ್ಯವಸ್ಥೆಗಳ ಅಭಿವೃದ್ಧಿಯಲ್ಲಿ ತನ್ನ ಮೂಲಗಳನ್ನು ಹೊಂದಿದೆ. ಇದು ASCII ಪಠ್ಯವನ್ನು ಮಾತ್ರ ನಿರ್ವಹಿಸಲು ವಿನ್ಯಾಸಗೊಳಿಸಲಾದ ವ್ಯವಸ್ಥೆಗಳ ಮೂಲಕ ಬೈನರಿ ಡೇಟಾವನ್ನು ಪ್ರಸಾರ ಮಾಡಲು ಸಮಸ್ಯೆಯನ್ನು ಪರಿಹರಿಸಲು ರೂಪಿಸಲಾಗಿದೆ.

ಎನ್‌ಕೋಡಿಂಗ್ ವ್ಯವಸ್ಥೆಯನ್ನು 1987 ರಲ್ಲಿ RFC 989 ನ ಪ್ರಕಟಣೆಯೊಂದಿಗೆ ಅಧಿಕೃತಗೊಳಿಸಲಾಯಿತು, ಇದು ಪ್ರೈವೇಸಿ ಎನ್‌ಹಾನ್ಸ್‌ಡ್ ಮೇಲ್ (PEM) ಪ್ರಮಾಣಿತವನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತಿತ್ತು. ಇದನ್ನು ನಂತರ RFC 1421 ಮತ್ತು ಇತರ ಸಂಬಂಧಿತ ಪ್ರಮಾಣಪತ್ರಗಳಲ್ಲಿ ನವೀಕರಿಸಲಾಯಿತು. "base64" ಎಂಬ ಶಬ್ದವು 64 ವಿಭಿನ್ನ ASCII ಅಕ್ಷರಗಳನ್ನು ಬೈನರಿ ಡೇಟಾವನ್ನು ಪ್ರತಿನಿಧಿಸಲು ಬಳಸುವ ಕಾರಣದಿಂದ ಬಂದಿದೆ.

ವೆಬ್ ಅಭಿವೃದ್ಧಿಯ ದೃಷ್ಟಿಕೋನದಲ್ಲಿ, base64 ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರಗಳು 1998 ರಲ್ಲಿ RFC 2397 ಯಲ್ಲಿ ಡೇಟಾ URIs ನ ಮೊದಲ ಪ್ರಸ್ತಾವನೆಯೊಂದಿಗೆ ಜನಪ್ರಿಯತೆಯನ್ನು ಪಡೆದವು, ಇದು ಬೈನರಿ ಡೇಟಾವನ್ನು ನೇರವಾಗಿ HTML, CSS ಮತ್ತು ಇತರ ವೆಬ್ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳಲ್ಲಿ ಒಳಗೊಂಡಂತೆ ಅನುಮತಿಸಿತು.

ವೆಬ್ ಅಭಿವೃದ್ಧಿಯಲ್ಲಿ base64-ಎನ್‌ಕೋಡ್ ಮಾಡಿದ ಚಿತ್ರಗಳ ಬಳಕೆ 2000 ರ ಮಧ್ಯದಲ್ಲಿ ಹೆಚ್ಚು ವ್ಯಾಪಕವಾಗಿ ಬಳಸಾಯಿತು, ಏಕೆಂದರೆ ಅಭಿವೃದ್ಧಿಪಡಿಸುವವರು HTTP ವಿನಂತಿಗಳನ್ನು ಕಡಿಮೆ ಮಾಡಲು ಮತ್ತು ಪುಟದ ಲೋಡ್ ಸಮಯವನ್ನು ಸುಧಾರಿಸಲು ಮಾರ್ಗಗಳನ್ನು ಹುಡುಕಿದರು. ಈ ತಂತ್ರವನ್ನು, ನಿಧಾನಗತಿಯ ಮೊಬೈಲ್ ಸಂಪರ್ಕಗಳಲ್ಲಿ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಸುಧಾರಿಸಲು, ಮೊಬೈಲ್ ವೆಬ್ ಅಭಿವೃದ್ಧಿಯ ಏರಿಕೆಯಲ್ಲಿ ವಿಶೇಷವಾಗಿ ಸ್ವೀಕರಿಸಲಾಯಿತು.

ಇಂದು, base64 ಎನ್‌ಕೋಡಿಂಗ್ ವೆಬ್ ಅಭಿವೃದ್ಧಿಯಲ್ಲಿ ಪ್ರಮುಖ ಸಾಧನವಾಗಿದೆ, ಆದರೆ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳು ಅಭಿವೃದ್ಧಿಯಾಗಿರುವಂತೆ ಅದರ ಬಳಕೆ ಹೆಚ್ಚು ಗುರಿಯಾಗಿದೆ. ಆಧುನಿಕ ವಿಧಾನಗಳು ಸಾಮಾನ್ಯವಾಗಿ base64 ಎನ್‌ಕೋಡಿಂಗ್ ಅನ್ನು ಆಯ್ಕೆಮಾಡುತ್ತವೆ, ಸಣ್ಣ, ಮಹತ್ವದ ಚಿತ್ರಗಳಿಗೆ ಮಾತ್ರ, ಅದನ್ನು ಹೆಚ್ಚು ಪರಿಣಾಮಕಾರಿ ವಿತರಣಾ ವಿಧಾನಗಳಂತೆ ಬಳಸುತ್ತವೆ.

ಉಲ್ಲೇಖಗಳು

  1. RFC 4648: The Base16, Base32, and Base64 Data Encodings
  2. RFC 2397: The "data" URL scheme
  3. MDN Web Docs: data URIs
  4. CSS-Tricks: Data URIs
  5. Base64 ಚಿತ್ರ ಎನ್‌ಕೋಡರ್
  6. Can I Use: Data URIs
  7. ವೆಬ್ ಕಾರ್ಯಕ್ಷಮತೆ: ಚಿತ್ರಗಳನ್ನು base64 ಎನ್‌ಕೋಡ್ ಮಾಡಲು ಯಾವಾಗ (ಮತ್ತು ಯಾವಾಗ ಇಲ್ಲ)
🔗

ಸಂಬಂಧಿತ ಸಾಧನಗಳು

ನಿಮ್ಮ ಕಾರ್ಯಪ್ರವೃತ್ತಿಗೆ ಉಪಯುಕ್ತವಾಗಬಹುದಾದ ಇನ್ನಷ್ಟು ಸಾಧನಗಳನ್ನು ಅನ್ವೇಷಿಸಿ

ಬೇಸ್64 ಎನ್‌ಕೋಡರ್ ಮತ್ತು ಡಿಕೋಡರ್: ಪಠ್ಯವನ್ನು ಬೇಸ್64 ಗೆ/ಮರುಹೊಂದಿಸಲು ಪರಿವರ್ತಿಸಿ

ಈ ಸಾಧನವನ್ನು ಪ್ರಯತ್ನಿಸಿ

ಬೈನರಿ-ದಶಮಲವ್ಯವಸ್ಥೆ ಪರಿವರ್ತಕ: ಸಂಖ್ಯಾ ವ್ಯವಸ್ಥೆಗಳ ನಡುವಿನ ಪರಿವರ್ತನೆ

ಈ ಸಾಧನವನ್ನು ಪ್ರಯತ್ನಿಸಿ

ಪರೀಕ್ಷೆ ಮತ್ತು ದೃಢೀಕರಣಕ್ಕಾಗಿ IBAN ಉತ್ಪಾದಕ ಮತ್ತು ಮಾನ್ಯತಾ ಸಾಧನ

ಈ ಸಾಧನವನ್ನು ಪ್ರಯತ್ನಿಸಿ

CSS ಮಿನಿಫೈಯರ್ ಟೂಲ್: ಆನ್‌ಲೈನ್‌ನಲ್ಲಿ CSS ಕೋಡ್ ಅನ್ನು ಆಪ್ಟಿಮೈಸ್ ಮತ್ತು ಸಂಕೋಚನಗೊಳಿಸಿ

ಈ ಸಾಧನವನ್ನು ಪ್ರಯತ್ನಿಸಿ

ಸಂಖ್ಯಾ ಆಧಾರ ಪರಿವರ್ತಕ: ಬೈನರಿ, ದಶಮಲವ, ಹೆಕ್ಸ್ ಮತ್ತು ಕಸ್ಟಮ್ ಆಧಾರಗಳು

ಈ ಸಾಧನವನ್ನು ಪ್ರಯತ್ನಿಸಿ

ಪರೀಕ್ಷೆಗಾಗಿ ಮಾನ್ಯ CPF ಸಂಖ್ಯೆಗಳ ಜನರೇಟರ್ ಸಾಧನ

ಈ ಸಾಧನವನ್ನು ಪ್ರಯತ್ನಿಸಿ

ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಮಿನಿಫೈಯರ್: ಕಾರ್ಯಕ್ಷಮತೆ ಕಳೆದುಕೊಳ್ಳದೆ ಕೋಡ್ ಗಾತ್ರವನ್ನು ಕಡಿಮೆ ಮಾಡಿ

ಈ ಸಾಧನವನ್ನು ಪ್ರಯತ್ನಿಸಿ