บีบอัด JavaScript และ Cascade Style Sheet ใน Yii Framework 2

wave
มานพ กองอุ่น 11 มี.ค. 2018 12:25:37 4,516

สำหรับบทเรียนรู้นี้เรามาทำการรวมไฟล์ JavaScript และ ไฟล์ CSS เพื่อบีบอัดให้มีขนาดเล็กลง ซึ่งแน่นอนจะทำให้การโหลดเว็บไซต์ได้ไวมากยิ่งขึ้น โดยทำการติดตั้ง Package  yii2-assets-compress

โดยพิิมพ์คำสั่งติดตั้งสำหรับ composer ดังนี้

composer require iisns/yii2-assets-compress

จากนั้นแก้ไขไฟล์ frontend/config/main.php เพื่อตั้งค่า component และสั่งให้ทำงานเมื่อเริ่ม Application

//ส่วน bootstrap

'bootstrap' => [
//...
        'assetsAutoCompress',
//...
    ],

//ส่วน components

'components' => [
        //...
        'assetsAutoCompress' => [
            'class' => '\iisns\assets\AssetsCompressComponent',
            'enabled' => true,
            'jsCompress' => true,
            'cssFileCompile' => true,
            'jsFileCompile' => true,
        ],
//...
],

เมื่อ view source ดูจะปรากฏว่าไฟล์ CSS ได้ถูกรวมในลักษณะนี้

<link href="/assets/css-compress/ed1c749f8a7bbfe7f17a90e132e41e16.css?v=1520740676" rel="stylesheet">

และไฟล์ JavaScript ได้ถูกรวมในลักษณะนี้

<script src="/assets/js-compress/299ba7f00bdf29af2189b2ba13dedd1b.js?v=1520740674"></script>

 


ความคิดเห็น

หากบทเรียนรู้มีความผิดพลาดประการใด หรือมีข้อเสนอแนะกรุณาแจ้ง contact@programmerthailand.com

เขียนบทเรียนรู้ของคุณ

รายละเอียด
  • ดู 4,516
  • รักเลย 0
  • หมวดหมู่ Yii Framework 2 (Yii2)
  • เขียนเมื่อ
  • แก้ไขเมื่อ
  • Tags yii yii2 advanced compress javascript css
ข้อมูลผู้เขียน
มานพ กองอุ่น

มานพ กองอุ่น

เป็นสมาชิกเมื่อ: 18 ธ.ค. 2009

เนื้อหาที่เกี่ยวข้อง