คลังเก็บบล็อก

ปรีโหลดรูปภาพ


เวลาทำงานกับรูปภาพ ปัญหาที่เจอบ่อยก็คือ รูปโหลดไม่ทันเห็นเป็นหน้า เว้าๆ แหว่งๆ วิธีแก้คือการทำ preload เอารูปมาเก็บเอาไว้ใน แคช (cache) ก่อนเวลาใช้จะได้มีทันใช้

function loadImages(sources)
{
	images = {};
	var loadedImages = 0;
	var numImages = 0;
	/* get num of sources */
	for(var src in sources)
	{
		numImages++;
	}
	for(var src in sources)
	{
		images[src] = new Image();
		images[src].onload = function()
		{
			if(++loadedImages >= numImages)
			{
				/* ทำงานได้แล้ว  ใส่ function ต่อไปตรงนี้ */
				return images;
			}
		};
		images[src].src = sources[src];
	}
}

var sources = {
	darthVader: 'http://www.html5canvastutorials.com/demos/assets/darth-vader.jpg',
	yoda: 'http://www.html5canvastutorials.com/demos/assets/yoda.jpg',
};

images = loadImages(sources);
โฆษณา

แก้ YII Assets ย้าย static cache folder


โดยปกติ yii จะเก็บไฟล์ static บางไฟล์ที่เป็น CSS, JavaScript ทั้งที่เป็น framework อย่าง jQuery หรือไฟล์ที่เกิดจากการใช้คำสั่ง Yii::app()->getClientScript()->registerScript(‘featured’ ,”…”); หรือ Yii::app()->clientScript->registerCoreScript(‘jquery’); ไว้ใน folder assets/ค่าสุ่ม บางครั้งเราแก้ไขไปแล้ว แต่ไฟล์พวกนี้ยัง cache ของเดิมอยู่เพราะว่า hash ไม่ได้ต่างจากเดิม หน้าเว็บจึงทำงานไม่ถูกต้องตามที่ตั้งใจไว้ วิธีแก้คือการที่จะต้องเข้าไปลบออกทั้งโฟลเดอร์ ซึ่งไม่สดวกนักเพราะว่าใน assets ยังมีไฟล์ที่เป็นดาต้าจริงๆ อยู่ด้วย ทางที่จึงควรแยกไฟล์ที่เป็น static cache พวกนี้ออกไปไว้ที่อื่นเพื่อความสดวกในการทดสอบและปลอดภัยของข้อมูล

สมมุติว่าสร้างโฟลเดอร์เก็บไฟล์ static cache ไว้ที่ D:/xampp/htdocs/yiiTest/assetsRuntime (user ต้องเข้าถึงได้จาก internet และต้องกำหนดให้ php มีสิทธิเขียน / ลบไฟล์ อย่างน้อย cmod ต้องเป็น 0755 ) แล้วไปที่ protected\config\ main.php เพิ่มบรรทัดตามตัวอย่าง

	'basePath'=>dirname(__FILE__).DIRECTORY_SEPARATOR.'..',
	'name'=>'My Web Application',
…
	// application components
	'components'=>array(
		'assetManager'=>array(
			'basePath'=>'D:\xampp\htdocs\yiiTest\assetsRuntime',
			'baseUrl'=>'/yiiTest/assetsRuntime/'
		),
…

อาจจะลบโฟลเดอร์ static cache ใน assets เก่าออก ครั้งต่อไปที่เขียนไฟล์ จะเขียนลงที่ใหม่

%d bloggers like this: