WooCommerce: ทำไม & วิธีปิดการใช้งาน Ajax Cart Fragments

หากคุณอยู่ที่นี่ นั่นเป็นเพราะเว็บไซต์ WooCommerce ของคุณช้า และคุณสงสัยว่าทำไม URL “ /?wc-ajax=get_refreshed_fragments ” จึงสร้างความล่าช้าและการโหลดเซิร์ฟเวอร์ (เพิ่มขึ้นอย่างรวดเร็ว)

นอกจากนี้ยังมีวรรณกรรมออนไลน์เกี่ยวกับ WooCommerce Ajax Cart Fragments มากเกินไป (รวมถึงปลั๊กอินเฉพาะและตัวเลือกปลั๊กอินประสิทธิภาพ) และคุณต้องการเรียนรู้อย่างรวดเร็วว่ามันคืออะไรก่อนที่จะเข้าใจว่าคุณควรปิดการใช้งานหรือไม่และอย่างไร

เครื่องมือเพิ่มประสิทธิภาพประสิทธิภาพ เช่น Pingdom และ GTMetrix มักจะตำหนิฟังก์ชัน WooCommerce เล็กน้อยนี้ และการปิดใช้งานอย่างระมัดระวังสามารถเพิ่มความเร็ว การโหลดหน้าเว็บ และอัตรา Conversion การขายได้ในที่สุด

นี่คือทั้งหมดที่คุณต้องรู้

WooCommerce Ajax Cart Fragment คืออะไร?

แต่ก่อนอื่น สำหรับคนที่ไม่รู้ว่า Ajax คือ อะไร ?

ในการพัฒนาเว็บ Ajax ( AJAX = Asynchronous JavaScript And XML ) เป็นเทคนิคการพัฒนาเว็บที่สรุปได้ว่าช่วยให้คุณสามารถ เรียกใช้ฟังก์ชันต่างๆ ได้โดยไม่ต้องรีเฟรชหน้าเว็บไซต์

นึกถึง "Ajax Add to Cart" ในหน้าร้านค้า WooCommerce: คุณสามารถเพิ่มสินค้าลงในรถเข็น (และอัปเดตรถเข็น) โดยไม่ต้องบังคับให้โหลดหน้าใหม่ Ajax ทำงานในพื้นหลังและสื่อสารกับเซิร์ฟเวอร์ "แบบอะซิงโครนัส"

เมื่อชัดเจนแล้ว มาดูกัน ว่า WooCommerce Ajax Cart Fragments คือ อะไร และ URL “ yoursite.com/?wc-ajax=get_refreshed_fragments ” หมายถึงอะไร

เรื่องสั้นสั้น ๆ แม้แต่ในเว็บไซต์ขนาดเล็กและแม้แต่ในหน้าที่ไม่ใช่ WooCommerce WooCommerce พยายาม "รับ" รายละเอียดตะกร้าสินค้าเพื่อให้สามารถ "คำนวณ" รถเข็นใหม่ทุกครั้งที่มีการดำเนินการ (หรือไม่ทำ!) ในหน้า WordPress ที่กำหนด

ซึ่ง ช่วยให้ WooCommerce สามารถอัปเดตวิดเจ็ตรถเข็นและ "ฟัง" ทันทีต่อเหตุการณ์ Ajax Add to Cart ที่อาจต้องมีการอัปเดตรถเข็น

โดยทั่วไป WooCommerce จะเรียก “ /?wc-ajax=get_refreshed_fragments ” เพื่ออัปเดตรายการรถเข็นและยอดรวมรถเข็นแบบอะซิงโครนัส กล่าวคือ โดยไม่ต้องรีเฟรชหน้าเว็บไซต์ที่คุณกำลังเข้าชม

Ajax นั้นยอดเยี่ยมและทุกอย่าง แต่อย่าประมาทผลกระทบด้านประสิทธิภาพและข้อขัดแย้งของปลั๊กอินที่ฟังก์ชันเล็กน้อยนี้อาจทำให้เกิด ซึ่งนำเราไปสู่ส่วนถัดไป…

เหตุใดจึงปิดการใช้งาน WooCommerce Ajax Cart Fragments

เพื่อให้รถเข็นอัปเดตในทุกหน้าของเว็บไซต์ของคุณ WooCommerce เรียกใช้ฟังก์ชัน Ajax นี้ทุกครั้ง

แม้แต่ในหน้าเกี่ยวกับ แม้แต่ในหน้าแรกหากคุณไม่มีสินค้า แม้แต่ในหน้าติดต่อหากคุณเพียงแค่มีแบบฟอร์มการติดต่อ

หากธีมของคุณไม่มีวิดเจ็ตแบบเลื่อนลงตะกร้าสินค้าของ WooCommerce และหากคุณ ไม่มีสินค้าที่สามารถเพิ่มลงในรถเข็น บนหน้าเว็บไซต์เฉพาะ คุณควรลบฟังก์ชัน Ajax ทั้งหมดออก

ยิ่งไปกว่านั้น หากคุณเลือกจากการตั้งค่า WooCommerce เพื่อเปลี่ยนเส้นทางผู้ใช้ไปยังรถเข็นหลังจากเพิ่มผลิตภัณฑ์ใดๆ ลงในรถเข็น แสดงว่าคุณกำลังบังคับให้เปลี่ยนเส้นทางหน้า (ไปยังหน้ารถเข็น) ดังนั้น การเปิดใช้งาน Ajax Cart Fragments จึงไม่มีประโยชน์

ตามหลักการแล้ว ที่เดียวที่ " /?wc-ajax=get_refreshed_fragments ” ควรเรียกใช้คือ หน้าและที่เก็บถาวรของ WooCommerce ซึ่งลูกค้าของคุณ สามารถเพิ่มในรถเข็นได้ และคุณต้องการใช้วิดเจ็ตรถเข็นแบบไดนามิก

ตัวอย่างเช่น หากคุณมีปุ่ม Add to Cart ในหน้าหมวดหมู่ของคุณ และคุณต้องการให้วิดเจ็ต Cart อัปเดตตามนั้นโดยไม่ต้องโหลดหน้าซ้ำ (และคุณได้เปิดใช้งาน Ajax add to cart ไว้) คุณต้องมี “ /?wc-ajax=get_refreshed_fragments “ คล่องแคล่ว.

นอกจากนี้ ใน หน้ารถเข็น คุณสามารถเปลี่ยนจำนวนหรือลบรายการโดยไม่ต้องรีเฟรชหน้า และในนั้นคุณยังต้องการให้วิดเจ็ตรถเข็นอัปเดตตามนั้นด้วย (แต่คำถามจริงที่นี่คือ: เหตุใดจึงมีวิดเจ็ตรถเข็นบนหน้ารถเข็น ไม่มีเหตุผล? ) ดังนั้น ในหน้ารถเข็น คุณต้องเปิดใช้งาน “/?wc-ajax=get_refreshed_fragments” มิฉะนั้นวิดเจ็ตจะไม่รีเฟรชหากคุณอัปเดตรถเข็น

บทสรุป:

1. หากธีมของคุณ ไม่มีวิดเจ็ต Cart ส่วนหัวแบบไดนามิก คุณสามารถปิดการใช้งาน “/?wc-ajax=get_refreshed_fragments”
2. หากธีมของคุณมีวิดเจ็ตส่วนหัวแบบไดนามิก แต่คุณไม่สนใจที่จะ แสดงเนื้อหาวิดเจ็ตรถเข็นในขณะเดินทาง คุณสามารถปิดใช้งาน “/?wc-ajax=get_refreshed_fragments” ได้ทุกที่
3. หากคุณต้องการให้ฟังก์ชันวิดเจ็ตรถเข็นใช้งาน ได้ คุณควรปิดใช้งาน “/?wc-ajax=get_refreshed_fragments” เฉพาะบนหน้าที่ไม่มีฟังก์ชัน Ajax Add to Cart (คลังเก็บผลิตภัณฑ์ WooCommerce) หรือฟังก์ชันการอัปเดตรถเข็น (หน้ารถเข็น)

จะปิดการใช้งาน WooCommerce Ajax Cart Fragment ได้อย่างไร

ตอนนี้เราเข้าใจแล้วว่า Cart Fragment คืออะไรและทำไม/เมื่อใดจึงควรถูกลบ เราก็สามารถลงโค้ดได้เล็กน้อย

แน่นอนว่ามีปลั๊กอินสำหรับสิ่งนั้น แต่เมื่อคุณสามารถใช้ฟังก์ชันเช่น PHP สองสามบรรทัดนี้ ก็ไม่สมเหตุสมผลเลยที่จะค้นหาโซลูชันอื่น แม้ว่าคุณจะไม่รู้วิธีเขียนโค้ดก็ตาม

แต่ก่อนอื่น เรามาดูกันว่า WooCommerce เพิ่มการเรียก Ajax นี้อย่างไร (ในแง่ของการพัฒนา เราจะพูดว่า "มัน เข้าคิว สคริปต์นี้อย่างไร")

ก่อนอื่น สคริปต์ “ wc-cart-fragments ” ถูกอธิบายโดยฟังก์ชันที่เรียกว่า “register_scripts()” มันเรียกสคริปต์ JS จากโฟลเดอร์ /assets และต้องเปิดใช้งาน JQuery และคุกกี้:

'wc-cart-fragments' => array(
	'src'     => self::get_asset_url( 'assets/js/frontend/cart-fragments' . $suffix . '.js' ),
	'deps'    => array( 'jquery', 'js-cookie' ),
	'version' => WC_VERSION,
),

ในไฟล์เดียวกัน นี่คือเวลาที่เรียก “ wc-cart-fragments ”:

self::enqueue_script( 'wc-cart-fragments' );

หากเราดูที่ฟังก์ชัน “enqueue_script()” เราจะพบว่าสคริปต์ “ wc-cart-fragments ” ของเราได้รับการลงทะเบียนครั้งแรกแล้วจึงจัดคิวตามเอกสารของ WordPress (https://developer.wordpress.org/reference/ ฟังก์ชั่น/wp_enqueue_script):

private static function enqueue_script( $handle, $path = '', $deps = array( 'jquery' ), $version = WC_VERSION, $in_footer = true ) {
	if ( ! in_array( $handle, self::$scripts, true ) && $path ) {
		self::register_script( $handle, $path, $deps, $version, $in_footer );
	}
	wp_enqueue_script( $handle );
}

หากมีบางสิ่ง "ถูกจัดคิว" ก็สามารถ "dequeued" ได้ (คล้ายกับฟังก์ชัน add_action() และ remove_action() PHP)

คุณต้องตรวจสอบให้แน่ใจว่าได้เรียกใช้ฟังก์ชัน "dequeue" หลังจาก "enqueue" เพื่อให้มีการเพิ่มไว้แล้วและคุณสามารถลบออกได้ (ด้วยเหตุนี้ลำดับความสำคัญ = 11 เนื่องจาก "wc-cart-fragments" ถูกจัดคิวตามลำดับความสำคัญเริ่มต้นของ 10).

ดร.:

/**
 * @snippet       Disable WooCommerce Ajax Cart Fragments Everywhere
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 3.6.4
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'wp_enqueue_scripts', 'bbloomer_disable_woocommerce_cart_fragments', 11 ); 

function bbloomer_disable_woocommerce_cart_fragments() { 
	wp_dequeue_script( 'wc-cart-fragments' ); 
}

โปรดทราบว่าในกรณีที่คุณมีวิดเจ็ตรถเข็นส่วนหัว การ ดำเนินการนี้จะทำลาย "ตะกร้าสินค้าแบบเลื่อนลง" คุณจะยังคงเห็นจำนวนสินค้าและยอดรวมตะกร้าสินค้าในส่วนหัว แต่เมื่อวางเมาส์เหนือ คุณจะไม่ได้รับสินค้าและปุ่มรถเข็น/ชำระเงิน

ใน Business Bloomer ฉันปิดใช้งานวิดเจ็ตรถเข็นโดยสมบูรณ์ ดังนั้นจึงเหมาะสมที่จะใช้ฟังก์ชันนี้

ในกรณีที่คุณต้องการ เพิ่มประสิทธิภาพหน้าแรกของคุณและปล่อย "wc-cart-fragments" ไว้บนหน้าเว็บไซต์อื่น คุณสามารถใช้ข้อมูลโค้ดนี้แทน:

/**
 * @snippet       Disable WooCommerce Ajax Cart Fragments On Static Homepage
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 3.6.4
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'wp_enqueue_scripts', 'bbloomer_disable_woocommerce_cart_fragments', 11 ); 

function bbloomer_disable_woocommerce_cart_fragments() { 
	if ( is_front_page() ) wp_dequeue_script( 'wc-cart-fragments' ); 
}

ความคิดสุดท้าย: WooCommerce Ajax Cart Fragments ใช่หรือไม่?

เราพบว่าการปิดใช้งาน Ajax Cart Fragments “สามารถ” ให้ความเร็วเว็บไซต์เพิ่มขึ้น แต่ยัง “อาจ” ทำให้เกิดปัญหาบางอย่าง ส่วนใหญ่ถ้าคุณต้องการใช้วิดเจ็ตตะกร้าแบบเลื่อนลงของคุณต่อไป

ดังนั้น ในส่วนนี้ ฉันต้องการดูสิ่งที่คนอื่นค้นพบเกี่ยวกับ “/?wc-ajax=get_refreshed_fragments”

ให้ประโยชน์มากกว่าข้อเสียจริงหรือ? มันเพิ่มความเร็วหน้าเว็บไซต์ของคุณจริงหรือ คุ้มไหมที่จะปิดการใช้งาน Cart Fragment?

การแจ้งเตือนสปอยเลอร์: ขึ้นอยู่กับ .

Colm Troy จาก CommerceGurus ได้ทดสอบ Ajax Cart Fragments อย่างลึกซึ้ง (รวมถึงส่วนอื่นๆ ที่คุณควรอ่านในบทความของเขา: https://www.commercegurus.com/guides/speed-up-woocommerce/) และในคำแนะนำของเขา เขาพบว่า นั่น:

…เวลาคำขอ “/?wc-ajax=get_refreshed_fragments” ใช้เวลา 448 มิลลิวินาที ซึ่งเป็นคำขอ http ที่ช้าที่สุดของเรา ณ จุดนี้

ในเซิร์ฟเวอร์ที่ช้ากว่าบางเครื่องที่มีฐานข้อมูลขนาดใหญ่และไม่ได้รับการปรับให้เหมาะสม คำขอนี้มักจะใช้เวลาดำเนินการมากกว่า 1-2 วินาที

ข่าวดีก็คือคำขอนี้ไม่มีการบล็อกและทำงานได้ดีหลังจากโหลด DOM ดังนั้นโดยทั่วไปแล้วจะไม่ส่งผลกระทบต่อเวลาในการโหลดที่รับรู้ของเรา (แต่จะทำร้ายเวลาที่โหลดเต็มที่ของเราและอาจส่งผลเสียบางอย่างที่ GPSI กังวลเช่นเวลา เพื่อโต้ตอบและไม่ได้ใช้งาน CPU ตัวแรก)

เขายังบอกฉันเมื่อเร็ว ๆ นี้ว่า:

ฉันได้ข้อสรุปว่ามือใหม่ของ WooCommerce มักจะจบลงด้วยการทำลายไซต์ของพวกเขาโดยเอาชิ้นส่วนออก เนื่องจากพวกเขาไม่ได้คิดอย่างเต็มที่ถึงสถานการณ์ต่างๆ ที่วิดเจ็ตรถเข็นสามารถปรากฏได้อย่างเต็มที่ ดังนั้น จึงควรดำเนินการด้วยความระมัดระวัง

ในร้านค้าของ WooCommerce ที่มีจำนวนสินค้าเพิ่มขึ้นอย่างรวดเร็วและปริมาณการใช้ข้อมูลจำนวนมาก สิ่งแรกที่เราทำคือ ถอดชิ้นส่วนรถเข็นออก ลบวิดเจ็ตรถเข็น และให้ลูกค้าเปลี่ยนเส้นทางไปยังรถเข็นเมื่อเพิ่มในรถเข็น

เก็บของสวย เรียบง่าย และรวดเร็ว

ต้องการให้การสนทนาดำเนินต่อไปหรือไม่? แบ่งปันข้อเสนอแนะการทดสอบและความคิดเห็นของคุณในความคิดเห็น