สุดยอดกลยุทธ์ CSS และ JS การรวม / การย่อขนาดสำหรับ D7


8

Drupal 6 มีโมดูลadvagg ที่ยอดเยี่ยมซึ่งทำงานได้อย่างยอดเยี่ยมกับการรวม CSS และ JS อย่างชาญฉลาดแต่ปัจจุบันไม่มี D7 ที่วางจำหน่าย

สิ่งที่ฉันต้องการบรรลุคือ:

  • ไฟล์ CSS และ JS ที่น้อยกว่า (5 CSS และ 5 ไฟล์ JS นั้นมากเกินไป)
  • ไฟล์ JS มีการลดขนาด (ปัจจุบัน core จะใช้สำหรับ CSS เท่านั้น)

มี drupal 7 solution ที่จะช่วยได้ไหม ประสบการณ์ของผู้อื่นในการเพิ่มประสิทธิภาพนี้คืออะไร


แก้ไข:คำถามที่ถูกโพสต์ในปี 2011 ขณะนี้มีการเปิดตัว D7 มีเสถียรภาพมากของadvagg

คำตอบ:


12

สำหรับ D7 นั้นมีCore Libraryซึ่งมีโหมดการเรียนรู้ที่รวบรวมขึ้นอยู่กับสถิติโลกแห่งความจริงเกี่ยวกับเว็บไซต์ของคุณ

หากคุณต้องการให้เดรัจฉานบังคับให้ทุกอย่างกลายเป็นมวลรวมก้อนใหญ่ฉันได้เขียนบทความพร้อมรหัสตัวอย่างบางส่วน:

/**
 * Implements hook_js_alter().
 */
function mymodule_js_alter(&$javascript) {
  uasort($javascript, 'drupal_sort_css_js');
  $i = 0;
  foreach ($javascript as $name => $script) {
    $javascript[$name]['weight'] = $i++;
    $javascript[$name]['group'] = JS_DEFAULT;
    $javascript[$name]['every_page'] = FALSE;
  }
}

/**
 * Implements hook_css_alter().
 */
function mymodule_css_alter(&$css) {
  uasort($css, 'drupal_sort_css_js');
  $i = 0;
  foreach ($css as $name => $style) {
    $css[$name]['weight'] = $i++;
    $css[$name]['group'] = CSS_DEFAULT;
    $css[$name]['every_page'] = FALSE;
  }
}

ปัญหา Drupal.org # 1034208ยังเสนอให้ผ่อนคลายข้อกำหนดการสั่งซื้อที่เข้มงวดเล็กน้อย


ดูเหมือนว่ากลุ่มยักษ์ไม่ได้สร้างพฤติกรรมที่ถูกต้องแน่นอนมันจะทำให้ไฟล์ CSS / JS ขนาดใหญ่ 1 ไฟล์สำหรับหน้า แต่ไฟล์นี้จะเปลี่ยนไปขึ้นอยู่กับหน้าที่คุณอยู่ เห็นได้ชัดว่าน้อยกว่าอุดมคติ
wiifm

ถูกต้องหากแต่ละหน้าโหลดไฟล์ JS ที่แตกต่างกันผลรวมจะต้องแตกต่างกัน คุณเพิ่งค้นพบสาเหตุที่ Drupal 7 แยกไฟล์ออกเป็นกลุ่มการทำงาน (JS_LIBRARY, JS_DEFAULT และ JS_THEME) สำหรับไซต์ที่ซับซ้อนมักมีประสิทธิภาพมากกว่าไฟล์ขนาดยักษ์เพียงไฟล์เดียว
Dylan Tack

1
หากมี 3 กลุ่มจะโหลดได้ 5 ไฟล์ในส่วนหัวได้อย่างไร? ทำไมไม่มากกว่า 3? การรวมทุกอย่างใน 1 ไฟล์เป็นความคิดที่น่ากลัว แต่จะทำให้ไฟล์ JS มีค่าน้อยที่สุดได้อย่างไร
Rudie

ฉันลองใช้รหัสที่กล่าวถึงที่นี่ จริงๆแล้วมันสร้างไฟล์ js ที่บีบอัดสองไฟล์ให้ฉัน ฉันจะทำให้เป็นไฟล์ js หนึ่งไฟล์ได้อย่างไร
ARUN

@DylanTack เว็บไซต์ของฉันมีปัญหาในการโหลด css fiels [ drupal.stackexchange.com/questions/128649/ ที่อยู่เว็บไซต์ [ living.md/]ฉันหลงทางที่จะวางรหัสของคุณและฉันสามารถใช้รหัสของคุณพร้อมกับ โมดูล advagg?
ยามา

3

AdvAgg D7 กำลังได้รับการพัฒนา ตัวเลือกอื่น ๆ (ราคารวมอยู่ในหน้าโครงการของพวกเขา):

... อนุญาตการย่อ JavaScript ของไซต์ได้ในทันทีด้วย uglify.js โมดูลอาศัยบริการเว็บ (uglify.me) ตามค่าเริ่มต้นเพื่อทำการลดขนาดดังนั้นคุณไม่จำเป็นต้องทำการประมวลผลล่วงหน้าบนเซิร์ฟเวอร์ของคุณเพื่อรับประโยชน์จาก JavaScript ที่ย่อเล็กสุด

... ออกแบบมาเพื่อช่วยเร่งประสิทธิภาพการทำงานของส่วนหน้าในเว็บไซต์ ในรุ่นแรกของโมดูล Speedy นี้จะให้ไฟล์ JavaScript หลักรุ่นย่อที่ยังไม่ได้ลดขนาด ตัวอย่างเช่นมีการจัดเตรียมเวอร์ชันย่อของ drupal.js ในขณะที่ jquery.js (ลดขนาดไปแล้ว) ไม่ได้เป็น


AdvAgg 7.x มาถึง RC ตัวแรกแล้ว drupal.org/project/advaggแนะนำให้ใช้
mikeytown2
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.