GyaanSetu WebDev

Frontend, Backend และ DevOps สำหรับเว็บยุคใหม่

230 articlesDeep, practical knowledge

Soft 404 ใน Next.js ทำให้เสีย Crawl Budget และเสี่ยงต่อการถูกลงโทษด้าน SEO

Google Search Console จะระบุหน้าเว็บที่ส่งสถานะ 200 OK แต่ไม่มีเนื้อหาว่าเป็น Soft 404 ซึ่งใน Next.js การใช้ Dynamic Routing โดยไม่มีการตรวจสอบข้อมูลที่เหมาะสมมักทำให้เกิดปัญหานี้ ส่งผลให้เสีย Crawl Budget, อันดับลดลง และอัตรา Bounce Rate พุ่งสูงขึ้น

WebDev · 3 min read

useSyncExternalStore ใน React 18 ช่วยกำจัดปัญหา Tearing จาก External State

Hook ใหม่นี้จะทำการอ่าน snapshot ในระหว่างการ render เพื่อรับประกันว่าทุกคอมโพเนนต์จะเห็นค่าเดียวกัน แม้ในขณะที่ concurrent renderer ของ React จะหยุดชั่วคราวหรือทำการ render ซ้ำ ซึ่งช่วยกำจัดปัญหา "tearing" ทางสายตาที่เคยเป็นปัญหาในรูปแบบการใช้ useEffect แบบเดิม

WebDev · 3 min read

การ Migration PostgreSQL ทำให้เกิดฟังก์ชันซ้ำโดยไม่ตั้งใจ จนทำให้ Production API ล่ม

นักพัฒนาได้เพิ่ม optional argument ในคำสั่ง CREATE OR REPLACE FUNCTION แต่ PostgreSQL กลับสร้าง overload ใหม่ขึ้นมาแทนที่จะเขียนทับฟังก์ชันเดิม การนิยามฟังก์ชันที่ซ้ำกันนี้ทำให้เกิดข้อผิดพลาด “function is not unique” ซึ่งส่งผลให้ API ที่ใช้งานจริงตอบกลับมาเป็น error 400

WebDev · 3 min read

ยกระดับ SEO: Next.js 14 ส่งมอบ HTML ที่เรนเดอร์เสร็จสมบูรณ์ ช่วยลดความล่าช้าในการ Crawl

จากการทดสอบอย่างรวดเร็วบนบล็อกส่วนตัว การย้ายการดึงข้อมูล (data fetching) ไปไว้ใน Server Component ช่วยลดขนาด JavaScript bundle ลงได้ประมาณ 60% และลดเวลา First Paint ของหน้าเว็บลงเหลือไม่ถึง 200 ms ทำให้สามารถส่งมอบ HTML ได้ทันทีทั้งแก่ผู้ใช้งานและตัว Crawlers

WebDev · 3 min read

Task Asyncio หายไปใน Production เมื่อไม่ได้เก็บ Reference – แก้ไขได้ด้วยการใช้ Set

ใน Production, task แบบ fire-and-forget ที่สร้างด้วย asyncio.create_task อาจถูก Python’s garbage collector ลบออกไปหากคุณไม่ได้เก็บ reference ไว้ ซึ่งจะทำให้เกิดความล้มเหลวแบบเงียบๆ (silent failures) และแสดงข้อผิดพลาดว่า “Task was destroyed but it is pending!”

WebDev · 2 min read

Web Locks API ช่วยป้องกันไม่ให้หลายแท็บส่งคำขอ Refresh ไปยัง Auth Server พร้อมกันจนเกิดการถล่ม

ด้วยการนำ Axios 401 interceptor ไปครอบด้วย navigator.locks request จะทำให้มีเพียงแท็บเดียวเท่านั้นที่ทำการรีเฟรชผ่านเครือข่าย ในขณะที่แท็บอื่นๆ จะอ่าน JWT ตัวใหม่จาก localStorage แทน ซึ่งช่วยขจัดปัญหาการเกิด replay-attack แบบต่อเนื่องที่ส่งผลให้ผู้ใช้งานถูกล็อกเอาต์ออกจากระบบ

WebDev · 4 min read

SearchValues ช่วยลดเวลาการสแกนเหลือเพียง 3.3 ms บน Buffer ขนาด 32 MB – เร็วกว่า IndexOfAny ถึง 1.7 เท่า

เมื่อ SearchValues ให้ผลลัพธ์ที่คุ้มค่าจริงๆ ผู้คนต่างเรียก SearchValues<T ว่าเป็นเหมือนสูตรโกง พวกเขาบอกว่ามันทำให้การสแกนสตริงเร็วขึ้นถึงห้าเท่า ผมดูแลตัวแยกแยะล็อก (log parser) ที่ใช้ IndexOfAny ผมด...

WebDev · 3 min read

Founder Lab พบว่าคะแนน AI Intent Score ผันผวนถึง 2 คะแนน ทั้งที่ร้านค้า Shopify ไม่มีการเปลี่ยนแปลงใดๆ

การสแกนร้านค้า Shopify ของ Founder Lab ร้านเดิมซ้ำกัน 6 ครั้ง พบว่าคะแนนรวมยังคงอยู่ที่ 78 แต่คะแนนย่อยด้านความตั้งใจ (intent sub-score) ที่ขับเคลื่อนด้วย AI กลับผันผวนระหว่าง 4 ถึง 6 ซึ่งพิสูจน์ให้เห็นว่าการเปลี่ยนแปลงของคะแนนเพียงเล็กน้อยอาจเป็นเพียงสัญญาณรบกวนทางสถิติเท่านั้น

WebDev · 4 min read

ทำไมคำตอบที่ดูมั่นใจเกินไป ถึงอาจส่งผลเสียมากกว่าการไม่ตอบเลย

ทำไมคำตอบที่ดูมั่นใจเกินไป ถึงอาจส่งผลเสียมากกว่าการไม่ตอบเลย คุณสร้างแชทบอทภายในองค์กรจนเสร็จสิ้น โดยป้อนข้อมูลทั้งนโยบาย HR, ข้อกำหนดทางวิศวกรรม และเอกสารการปฐมนิเทศพนักงานทั้งหมดที่บริษัทมี...

WebDev · 4 min read

ตอนที่ฉันเริ่มลงมือสร้างเว็บไซต์แรก ความตื่นเต้นนั้นมันของจริงมาก ฉันคิดว่าส่วนที่ยากที่สุดคงจะเป็นการเรียนเขียนโค้ด—ตัวฉันเอง

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

WebDev · 4 min read

ข้อมูล Search Console เพียงสองสัปดาห์ทำให้แผนกลยุทธ์ SEO ของฉันผิดเพี้ยนไปหมด

ข้อมูล Search Console เพียงสองสัปดาห์ทำให้แผนกลยุทธ์ SEO ของฉันผิดเพี้ยนไปหมด ผมทำ lans.cloud ซึ่งเป็นแหล่งรวมเครื่องมือบนเบราว์เซอร์ฟรี 100 ชนิด ผมเริ่มต้นด้วยแผนกลยุทธ์ SEO แบบมาตรฐาน โดยมุ่งเป้าไปที่คำค้นหาแบบยาว...

WebDev · 3 min read