ຕົວຫຍໍ້ CSS

ດ້ວຍ CSS minifier, ທ່ານສາມາດຫຼຸດຜ່ອນໄຟລ໌ຮູບແບບ CSS. ດ້ວຍເຄື່ອງອັດ CSS, ທ່ານສາມາດເລັ່ງເວັບໄຊທ໌ຂອງເຈົ້າໄດ້ງ່າຍ.

ຕົວຫຍໍ້ CSS ແມ່ນຫຍັງ?

ຕົວຫຍໍ້ CSS ມີຈຸດປະສົງເພື່ອຫຍໍ້ໄຟລ໌ CSS ຢູ່ໃນເວັບໄຊທ໌. ແນວຄວາມຄິດນີ້, ເຊິ່ງຖືກນໍາໃຊ້ເປັນພາສາອັງກິດທຽບເທົ່າ (CSS Minifier), ປະກອບມີການຈັດລຽງໃນໄຟລ໌ CSS. ເມື່ອ CSSs ໄດ້ຖືກກະກຽມ, ເປົ້າຫມາຍຕົ້ນຕໍແມ່ນສໍາລັບຜູ້ບໍລິຫານເວັບໄຊທ໌ຫຼື coders ເພື່ອວິເຄາະສາຍຢ່າງຖືກຕ້ອງ. ເພາະສະນັ້ນ, ມັນປະກອບດ້ວຍຫຼາຍສາຍ. ມີເສັ້ນສະແດງຄວາມຄິດເຫັນທີ່ບໍ່ຈໍາເປັນແລະຊ່ອງຫວ່າງລະຫວ່າງເສັ້ນເຫຼົ່ານີ້. ນີ້ແມ່ນເຫດຜົນທີ່ວ່າໄຟລ໌ CSS ກາຍເປັນຍາວຫຼາຍ. ບັນຫາທັງຫມົດເຫຼົ່ານີ້ແມ່ນຖືກລົບລ້າງດ້ວຍ CSS minifier.

CSS minifier ເຮັດຫຍັງ?

ຄຽງຄູ່ກັບການປ່ຽນແປງທີ່ເຮັດໃນໄຟລ໌ CSS; ຂະ​ຫນາດ​ແມ່ນ​ຫຼຸດ​ລົງ​, ສາຍ​ທີ່​ບໍ່​ຈໍາ​ເປັນ​ໄດ້​ຖືກ​ໂຍກ​ຍ້າຍ​ອອກ​, ເສັ້ນ​ຄໍາ​ຄິດ​ເຫັນ​ທີ່​ບໍ່​ຈໍາ​ເປັນ​ແລະ​ຊ່ອງ​ຫວ່າງ​ຖືກ​ລົບ​. ຍິ່ງໄປກວ່ານັ້ນ, ຖ້າຫຼາຍກວ່າຫນຶ່ງລະຫັດຖືກລວມຢູ່ໃນ CSS, ລະຫັດເຫຼົ່ານີ້ຍັງຖືກລຶບຖິ້ມ.

ມີ plug-ins ແລະຄໍາຮ້ອງສະຫມັກຕ່າງໆສໍາລັບການດໍາເນີນງານເຫຼົ່ານີ້ທີ່ຜູ້ໃຊ້ສ່ວນໃຫຍ່ສາມາດປະຕິບັດດ້ວຍຕົນເອງ. ໂດຍສະເພາະສໍາລັບຜູ້ທີ່ໃຊ້ລະບົບ WordPress, ຂະບວນການເຫຼົ່ານີ້ສາມາດອັດຕະໂນມັດດ້ວຍ plugins. ດັ່ງນັ້ນ, ຄວາມເປັນໄປໄດ້ຂອງການເຮັດຜິດພາດແມ່ນຖືກລົບລ້າງແລະຜົນໄດ້ຮັບທີ່ມີປະສິດທິພາບຫຼາຍຂຶ້ນ.

ຜູ້ທີ່ບໍ່ໄດ້ໃຊ້ WordPress ສໍາລັບ CSS ຫຼືບໍ່ຕ້ອງການ plugins ທີ່ມີຢູ່ກໍ່ສາມາດນໍາໃຊ້ເຄື່ອງມືອອນໄລນ໌. ໂດຍການດາວໂຫລດ CSS ໄປຫາເຄື່ອງມືອອນໄລນ໌ຜ່ານອິນເຕີເນັດ, ໄຟລ໌ທີ່ມີຢູ່ໃນ CSS ຖືກຫຼຸດລົງໂດຍການປ່ຽນແປງ. ຫຼັງຈາກຂະບວນການທັງຫມົດສໍາເລັດແລ້ວ, ມັນຈະພຽງພໍທີ່ຈະດາວໂຫລດໄຟລ໌ CSS ທີ່ມີຢູ່ແລະອັບໂຫລດໄປຫາເວັບໄຊທ໌. ດັ່ງນັ້ນ, ການດໍາເນີນງານເຊັ່ນ CSS Minify ຫຼື shrinking ຈະສໍາເລັດຢ່າງສໍາເລັດຜົນ, ແລະບັນຫາທີ່ເປັນໄປໄດ້ທັງຫມົດທີ່ອາດຈະປະສົບຜ່ານ CSS ສໍາລັບເວັບໄຊທ໌ຈະຖືກລົບລ້າງ.

ເປັນຫຍັງທ່ານຄວນຫຍໍ້ໄຟລ໌ CSS ຂອງທ່ານ?

ການມີເວັບໄຊທ໌ທີ່ໄວບໍ່ພຽງແຕ່ເຮັດໃຫ້ Google ມີຄວາມສຸກ, ມັນຊ່ວຍໃຫ້ເວັບໄຊທ໌ຂອງທ່ານຈັດອັນດັບສູງໃນການຄົ້ນຫາແລະຍັງໃຫ້ປະສົບການຜູ້ໃຊ້ທີ່ດີກວ່າສໍາລັບຜູ້ມາຢ້ຽມຢາມເວັບໄຊທ໌ຂອງທ່ານ.

ຈືຂໍ້ມູນການ, 40% ຂອງປະຊາຊົນບໍ່ລໍຖ້າ 3 ວິນາທີເພື່ອໃຫ້ຫນ້າເວັບທໍາອິດຂອງທ່ານໂຫລດ, ແລະ Google ແນະນໍາໃຫ້ເວັບໄຊທ໌ໂຫລດພາຍໃນ 2-3 ວິນາທີ.

ການບີບອັດດ້ວຍເຄື່ອງມື CSS minifier ມີຜົນປະໂຫຍດຫຼາຍຢ່າງ;

  • ໄຟລ໌ຂະຫນາດນ້ອຍກວ່າຫມາຍຄວາມວ່າຂະຫນາດການດາວໂຫລດຂອງເວັບໄຊທ໌ຂອງທ່ານຫຼຸດລົງ.
  • ຜູ້ເຂົ້າຊົມເວັບໄຊທ໌ສາມາດໂຫລດແລະເຂົ້າເຖິງຫນ້າເວັບຂອງທ່ານໄດ້ໄວຂຶ້ນ.
  • ຜູ້ເຂົ້າຊົມເວັບໄຊທ໌ໄດ້ຮັບປະສົບການຂອງຜູ້ໃຊ້ດຽວກັນໂດຍບໍ່ຈໍາເປັນຕ້ອງດາວໂຫລດໄຟລ໌ຂະຫນາດໃຫຍ່.
  • ເຈົ້າຂອງເວັບໄຊທ໌ມີປະສົບການຄ່າໃຊ້ຈ່າຍແບນວິດຕ່ໍາເພາະວ່າຂໍ້ມູນຫນ້ອຍຖືກສົ່ງຜ່ານເຄືອຂ່າຍ.

CSS minifier ເຮັດວຽກແນວໃດ?

ມັນເປັນຄວາມຄິດທີ່ດີທີ່ຈະສໍາຮອງໄຟລ໌ຂອງເວັບໄຊທ໌ຂອງທ່ານກ່ອນທີ່ຈະຫຼຸດລົງໃຫ້ເຂົາເຈົ້າ. ທ່ານຍັງສາມາດເອົາມັນໄປອີກບາດກ້າວຫນຶ່ງແລະຫຍໍ້ໄຟລ໌ຂອງທ່ານໃນເວັບໄຊທ໌ທົດລອງ. ວິທີນີ້ທ່ານໃຫ້ແນ່ໃຈວ່າທຸກຢ່າງແມ່ນຂຶ້ນແລະດໍາເນີນການກ່ອນທີ່ຈະເຮັດການປ່ຽນແປງເວັບໄຊທ໌ສົດຂອງທ່ານ.

ມັນຍັງມີຄວາມສໍາຄັນທີ່ຈະປຽບທຽບຄວາມໄວຫນ້າຂອງທ່ານກ່ອນແລະຫຼັງຈາກການຫົດຕົວໄຟລ໌ຂອງເຈົ້າເພື່ອໃຫ້ທ່ານສາມາດປຽບທຽບຜົນໄດ້ຮັບແລະເບິ່ງວ່າການຫົດຕົວມີຜົນກະທົບໃດໆ.

ທ່ານສາມາດວິເຄາະຄວາມໄວຫນ້າຂອງທ່ານໂດຍໃຊ້ GTmetrix, Google PageSpeed ​​​​Insights, ແລະ YSlow, ເຄື່ອງມືທົດສອບປະສິດທິພາບແຫຼ່ງເປີດ.

ໃນປັດຈຸບັນໃຫ້ເຮົາເບິ່ງວິທີການເຮັດຂະບວນການຫຼຸດຜ່ອນ;

1. ຕົວຫຍໍ້ CSS ຄູ່ມື

ການຫຍໍ້ໄຟລ໌ດ້ວຍຕົນເອງໃຊ້ເວລາ ແລະຄວາມພະຍາຍາມຫຼາຍ. ດັ່ງນັ້ນທ່ານມີເວລາທີ່ຈະເອົາພື້ນທີ່, ເສັ້ນແລະລະຫັດທີ່ບໍ່ຈໍາເປັນອອກຈາກໄຟລ໌ແຕ່ລະຄົນບໍ? ອາດຈະບໍ່. ນອກເຫນືອຈາກເວລາ, ຂະບວນການຫຼຸດຜ່ອນນີ້ຍັງສະຫນອງພື້ນທີ່ຫຼາຍສໍາລັບຄວາມຜິດພາດຂອງມະນຸດ. ດັ່ງນັ້ນ, ວິທີການນີ້ບໍ່ໄດ້ຖືກແນະນໍາສໍາລັບການຫຍໍ້ໄຟລ໌. ໂຊກດີ, ມີເຄື່ອງມືການຍ່ອຍອອນໄລນ໌ຟຣີຈໍານວນຫຼາຍທີ່ອະນຸຍາດໃຫ້ທ່ານສາມາດຄັດລອກແລະວາງລະຫັດຈາກເວັບໄຊຂອງທ່ານ.

CSS minifier ເປັນເຄື່ອງມືອອນໄລນ໌ຟຣີເພື່ອຫຼຸດຜ່ອນ CSS. ເມື່ອທ່ານຄັດລອກແລະວາງລະຫັດໃສ່ໃນຊ່ອງຂໍ້ຄວາມ "Input CSS", ເຄື່ອງມືຈະຫຼຸດຜ່ອນ CSS. ມີທາງເລືອກໃນການດາວໂຫລດຜົນຜະລິດທີ່ຫຍໍ້ມາຈາກໄຟລ໌. ສໍາລັບນັກພັດທະນາ, ເຄື່ອງມືນີ້ຍັງສະຫນອງ API.

JSCompress , JSCompress ເປັນເຄື່ອງອັດ JavaScript ອອນລາຍທີ່ຊ່ວຍໃຫ້ທ່ານສາມາດບີບອັດແລະຫຼຸດຜ່ອນໄຟລ໌ JS ຂອງທ່ານເຖິງ 80% ຂອງຂະຫນາດຕົ້ນສະບັບ. ຄັດລອກແລະວາງລະຫັດຂອງທ່ານຫຼືອັບໂຫລດແລະປະສົມປະສານຫຼາຍໄຟລ໌ເພື່ອໃຊ້. ຫຼັງຈາກນັ້ນ, ໃຫ້ຄລິກໃສ່ "ບີບອັດ JavaScript - ບີບອັດ JavaScript".

2. CSS minifier ກັບ plugins PHP

ມີບາງ plugins ທີ່ຍິ່ງໃຫຍ່, ທັງຟຣີແລະທີ່ນິຍົມ, ທີ່ສາມາດຫຍໍ້ໄຟລ໌ຂອງທ່ານໂດຍບໍ່ຈໍາເປັນຕ້ອງເຮັດຂັ້ນຕອນຄູ່ມື.

  • ຮວມ,
  • ຫຍໍ້,
  • ໂຫຼດຫນ້າຈໍຄືນ,
  • ປັ໊ກອິນ WordPress.

ປັ໊ກອິນນີ້ເຮັດຫຼາຍກວ່າການຫຼຸດຜ່ອນລະຫັດຂອງທ່ານ. ມັນລວມໄຟລ໌ CSS ແລະ JavaScript ຂອງທ່ານ ແລະຫຼັງຈາກນັ້ນຈະຫຍໍ້ໄຟລ໌ທີ່ສ້າງຂຶ້ນໂດຍໃຊ້ Minify (ສໍາລັບ CSS) ແລະ Google Closure (ສໍາລັບ JavaScript). ການຫຼຸດຫນ້ອຍລົງແມ່ນເຮັດຜ່ານ WP-Cron ເພື່ອບໍ່ໃຫ້ຜົນກະທົບຕໍ່ຄວາມໄວຂອງເວັບໄຊທ໌ຂອງທ່ານ. ເມື່ອເນື້ອໃນຂອງໄຟລ໌ CSS ຫຼື JS ຂອງທ່ານປ່ຽນແປງ, ພວກມັນຈະຖືກສະແດງຄືນໃຫມ່, ດັ່ງນັ້ນທ່ານບໍ່ຈໍາເປັນຕ້ອງປະຖິ້ມ cache ຂອງທ່ານ.

JCH Optimize ມີບາງລັກສະນະທີ່ດີສໍາລັບ plugin ຟຣີ: ມັນສົມທົບແລະຫຍໍ້ CSS ແລະ JavaScript, ຫຼຸດຜ່ອນ HTML, ສະຫນອງການບີບອັດ GZip ເພື່ອສົມທົບໄຟລ໌, ແລະການສະແດງ sprite ສໍາລັບຮູບພາບພື້ນຫລັງ.

CSS Minify , ທ່ານພຽງແຕ່ຕ້ອງການຕິດຕັ້ງແລະເປີດໃຊ້ເພື່ອຫຼຸດຜ່ອນ CSS ຂອງທ່ານດ້ວຍ CSS Minify. ໄປ​ທີ່ Settings > CSS Minify ແລະ​ເປີດ​ນຳ​ໃຊ້​ພຽງ​ແຕ່​ທາງ​ເລືອກ​ດຽວ​ເທົ່າ​ນັ້ນ: Optimize and minify code CSS.

Fast Velocity Minify ດ້ວຍ ຫຼາຍກວ່າ 20,000 ການຕິດຕັ້ງທີ່ມີການເຄື່ອນໄຫວ ແລະໃຫ້ຄະແນນຫ້າດາວ, Fast Velocity Minify ແມ່ນໜຶ່ງໃນທາງເລືອກທີ່ເປັນທີ່ນິຍົມທີ່ສຸດສຳລັບການຫົດໄຟລ໌. ເພື່ອໃຊ້ມັນ, ທ່ານພຽງແຕ່ຕ້ອງການຕິດຕັ້ງແລະເປີດໃຊ້ງານ.

ໄປທີ່ Settings > Fast Velocity Minify. ທີ່ນີ້ເຈົ້າຈະພົບເຫັນຫຼາຍທາງເລືອກໃນການຕັ້ງຄ່າ plugin, ລວມທັງການຍົກເວັ້ນ JavaScript ແລະ CSS ຂັ້ນສູງສໍາລັບນັກພັດທະນາ, ທາງເລືອກ CDN ແລະຂໍ້ມູນເຊີຟເວີ. ການຕັ້ງຄ່າເລີ່ມຕົ້ນເຮັດວຽກໄດ້ດີສໍາລັບເວັບໄຊທ໌ສ່ວນໃຫຍ່.

ປັ໊ກອິນປະຕິບັດການຫົດຕົວຢູ່ໃນຫນ້າຫນ້າໃນເວລາທີ່ແທ້ຈິງແລະພຽງແຕ່ໃນລະຫວ່າງການຮ້ອງຂໍທີ່ບໍ່ແມ່ນແຄດຄັ້ງທໍາອິດ. ຫຼັງຈາກຄໍາຮ້ອງຂໍທໍາອິດຖືກດໍາເນີນການ, ໄຟລ໌ cache static ດຽວກັນແມ່ນໃຫ້ບໍລິການກັບຫນ້າອື່ນໆທີ່ຕ້ອງການຊຸດດຽວກັນຂອງ CSS ແລະ JavaScript.

3. CSS minifier ກັບ WordPress plugins

ຕົວຫຍໍ້ CSS ເປັນຄຸນສົມບັດມາດຕະຖານທີ່ເຈົ້າຈະພົບເຫັນຢູ່ໃນບ່ອນເກັບມ້ຽນ plugins.

  • WP Rocket,
  • W3 Total Cache,
  • WP SuperCache,
  • WP ແຄດໄວທີ່ສຸດ.

ພວກເຮົາຫວັງວ່າວິທີແກ້ໄຂທີ່ພວກເຮົາໄດ້ນໍາສະເຫນີຂ້າງເທິງນີ້ໄດ້ເຮັດໃຫ້ເຈົ້າເຂົ້າໃຈວິທີການເຮັດ CSS minifier ແລະທ່ານສາມາດເຂົ້າໃຈວິທີທີ່ທ່ານສາມາດນໍາໃຊ້ມັນກັບເວັບໄຊທ໌ຂອງທ່ານ. ຖ້າທ່ານໄດ້ເຮັດສິ່ງນີ້ກ່ອນ, ມີວິທີອື່ນໃດທີ່ທ່ານໃຊ້ເພື່ອເຮັດໃຫ້ເວັບໄຊທ໌ຂອງທ່ານໄວຂຶ້ນ? ຂຽນໃຫ້ພວກເຮົາໃນສ່ວນຄໍາເຫັນກ່ຽວກັບ Softmedal, ຢ່າລືມແບ່ງປັນປະສົບການແລະຄໍາແນະນໍາຂອງທ່ານເພື່ອປັບປຸງເນື້ອຫາຂອງພວກເຮົາ.