หนึ่งตัวเลือกเพิ่มเติมขึ้นอยู่กับชนิดของพารามิเตอร์ที่คุณต้องผ่านเข้าไปเรียกมันว่า (2a) คุณยังสามารถสร้างสคริปต์ PHP ที่สร้างผลลัพธ์แบบไดนามิกtext/css
หรือtext/javascript
มากกว่าtext/html
และให้ข้อมูลที่ต้องการโดยใช้พารามิเตอร์ GET แทนการโหลด WordPress แน่นอนว่าใช้งานได้เฉพาะในกรณีที่คุณต้องผ่านพารามิเตอร์ที่มีขนาดค่อนข้างเล็ก ตัวอย่างเช่นสมมติว่าคุณต้องส่งเฉพาะ URL ของโพสต์หรือไดเรกทอรีของไฟล์หรือสิ่งที่คล้ายกันคุณสามารถทำสิ่งนี้:
ใน header.php:
<script type="text/javascript" src="<?php print get_stylesheet_directory_uri();
?>/fancy-js.php?foo=bar&url=<?php print urlencode(get_permalink($post->ID)); ?>"></script>
ใน fancy-js.php:
<?php
header("Content-type: text/javascript");
?>
foo = <?php print json_encode($_GET['foo']); ?>;
url = <?php print json_encode($_GET['url']); ?>;
เป็นต้น
แต่สิ่งนี้อนุญาตให้คุณเข้าถึงข้อมูลที่ส่งผ่านโดยตรงในพารามิเตอร์ GET เท่านั้น และมันจะใช้ได้ก็ต่อเมื่อจำนวนของสิ่งที่คุณต้องผ่านมีขนาดค่อนข้างเล็กและการแสดงสิ่งเหล่านั้นค่อนข้างกะทัดรัด (โดยทั่วไปจะมีสตริงหรือค่าตัวเลขจำนวนหนึ่ง - ชื่อผู้ใช้พูดหรือไดเรกทอรีไม่ใช่รายการโพสต์ล่าสุดของผู้ใช้ทั้งหมดหรืออะไรทำนองนั้น)
สำหรับตัวเลือกใดตัวเลือกหนึ่งที่ดีที่สุด - ฉันไม่รู้ ขึ้นอยู่กับกรณีการใช้งานของคุณ ตัวเลือก (1) มีข้อดีของความเรียบง่ายและชัดเจนช่วยให้คุณเข้าถึงข้อมูล WordPress ใด ๆ ที่คุณอาจต้องการโดยไม่ต้องโหลดประสิทธิภาพการโหลด WordPress สองครั้ง มันเกือบจะแน่นอนว่าคุณควรทำอะไรเว้นแต่คุณจะมีเหตุผลที่ดีที่จะไม่ทำ (เช่นเนื่องจากขนาดของสไตล์ชีทหรือสคริปต์ที่คุณต้องใช้)
หากขนาดใหญ่พอที่จะทำให้เกิดปัญหาในแง่ของน้ำหนักหนึ่งหน้าของคุณคุณสามารถลอง (2) หรือ (2a)
หรืออย่างอื่น - นี่อาจเป็นความคิดที่ดีกว่า - คุณสามารถลองแยกส่วนต่าง ๆ ของสคริปต์หรือสไตล์ชีทที่ใช้ประโยชน์จากข้อมูลไดนามิกจากส่วนที่สามารถระบุได้แบบสแตติก บอกว่าคุณมีสไตล์ชีทที่ต้องส่งผ่านไดเรกทอรีจาก WordPress เพื่อตั้งค่าพารามิเตอร์พื้นหลังสำหรับองค์ประกอบ # my-fancy คุณสามารถใส่ทั้งหมดนี้ลงในองค์ประกอบส่วนหัว:
<style type="text/css">
#my-fancy-element {
background-image: url(<?php print get_stylesheet_directory_uri(); ?>images/fancy.png);
padding: 20px;
margin: 20px;
font-weight: bold;
text-transform: uppercase;
font-size: 12pt;
/* ... KB and KB of additional styles ... */
}
#another-fancy-element {
/* ... KB and KB of additional styles ... */
}
/* ... KB and KB of additional styles ... */
</style>
แต่ทำไมคุณต้องทำเช่นนั้น? บรรทัดเดียวเท่านั้นที่นี่ซึ่งขึ้นอยู่กับข้อมูลจาก WordPress ดีกว่าที่จะแยกเฉพาะบรรทัดที่ขึ้นอยู่กับ WordPress:
<style type="text/css">
#my-fancy-element {
background-image: url(<?php print get_stylesheet_directory_uri(); ?>images/fancy.png);
}
</style>
ใส่ทุกอย่างไว้ในสไตล์ชีทคงที่ที่คุณโหลดด้วยองค์ประกอบลิงก์มาตรฐาน (style.css หรืออะไรก็ตาม):
#my-fancy-element {
/* background-image provided dynamically */
padding: 20px;
margin: 20px;
font-weight: bold;
text-transform: uppercase;
font-size: 12pt;
/* ... KB and KB of additional styles ... */
}
#another-fancy-element {
/* ... KB and KB of additional styles ... */
}
/* ... KB and KB of additional styles ... */
และปล่อยให้น้ำตกทำงาน
เช่นเดียวกับ JavaScript: แทนที่จะทำสิ่งนี้:
<script type="text/javascript">
// Here comes a huge function that uses WordPress data:
function my_huge_function () {
// Do a million things ...
jQuery('#my-fancy').append('<a href="'+<?php json_encode(get_permalink($GLOBALS['post']->ID)); ?>+'">foo</a>);
// Do a million more things ...
my_other_function(<?php print json_encode(get_userdata($GLOBALS['post']->post_author); ?>);
}
function my_other_function (user) {
// Do a million things ...
}
</script>
แทนที่จะใส่สิ่งนี้ในองค์ประกอบของหัว:
<script type="text/javascript">
var WordPressPostData = {
url: <?php print json_encode(get_permalink($GLOBALS['post']->ID)); ?>,
author: <?php print json_encode(get_userdata($GLOBALS['post']->post_author)); ?>
}
</script>
จากนั้นวางส่วนที่เหลือลงในไฟล์ JavaScript แบบคงที่เขียนใหม่ my_huge_function () และ my_other_function () เพื่อใช้ประโยชน์ของ globals WordPressPostData.url และ WordPressPostData.author
40K ของ CSS หรือ 40K ของ JS สามารถแบ่งออกเป็น <1K ที่ขึ้นอยู่กับข้อมูลแบบไดนามิกและส่วนที่เหลือซึ่งสามารถระบุได้ในไฟล์ภายนอกแบบคงที่จากนั้นรวมอีกครั้งโดยใช้ cascade (สำหรับ CSS) หรือเข้าถึงได้ทั่วโลก ตัวแปร (กลม, องค์ประกอบ DOM หรืออะไรก็ตามที่คุณต้องการสำหรับ Cubby-hole)