บันทึกการปรับปรุงเว็บช่วงปลายปี 2018
เขียนเมื่อ 2019/01/03 23:47
แก้ไขล่าสุด 2021/09/28 16:42
ช่วงเดือนพฤศจิกายนปี 2018 หลังจากที่กลับมาจากเที่ยวญี่ปุ่นก็ได้เริ่มต้นศึกษาความรู้เพิ่มเติมเกี่ยวกับการเขียนเว็บแล้วก็ได้ทำการปรับปรุงตัวบล็อกไปพร้อมๆกับที่เขียนบันทึกในญี่ปุ่นไปด้วย
ตอนสิ้นปีจนถึงวันปีใหม่ได้เห็นบางคนเขียนบันทึกไล่เรียงว่าตัวเองทำอะไรไปบ้างทั้งปี 2018 คิดดูแล้วก็อยากเขียนเหมือนกัน แต่ขอแบ่งเป็นเรื่องๆดีกว่า
หน้านี้เขียนขึ้นเพื่อเป็นการบันทึกเอาไว้ว่าได้มีการทำอะไรไปบ้างในในส่วนของเว็บ ก็ถือเป็นส่วนหนึ่งของการสรุปเรื่องราวปี 2018
1. นำ vue.js มาใช้
สิ่งที่สำคัญที่สุดที่ได้เรียนรู้ในช่วงระหว่างนั้นก็เห็นจะเป็น vue.js นี่เอง ที่จริงรู้จักมานานแล้วแต่ไม่มีโอกาสได้เรียนรู้
vue.js ยังสามารถใช้งานแทน jquery ได้ในหลายๆส่วน เช่นคำสั่งที่มีการคลิกแล้วซ่อนแสดง
หน้าแรกที่ได้ลองเปลี่ยนมาใช้ vue.js ทั้งหมดเพื่อทดสอบก็คือหน้ารายชื่อโปเกมอน https://hinaboshi.com/ruamraichuepokemon
vue.js สามารถทำการวนซ้ำเพื่อนำข้อมูลออกมาไล่เรียงได้ ทำหน้าที่แทนคำสั่งวนซ้ำใน ruby on rails ได้ โค้ดก็ดูสวยสะอาดกว่าด้วย
ที่จริง vue.js มีตัวช่วยสำหรับสร้างเว็บแบบ SPA (single page apllication) อย่าง vue cli ทำให้ตอนแรกก็คิดว่าอยากเปลี่ยนเว็บให้เป็นแบบนั้นดู แต่เมื่อพิจารณาจุดอ่อนของเว็บแบบนี้ตรงที่ว่าจะทำให้การค้นหาใน google เจอได้ยากขึ้น ทำให้เลิกล้มไป
อีกทั้งถ้าจะทำต้องแก้โครงสร้างเว็บใหม่ ยิ่งต้องใช้เวลามาก ยังไม่มีเวลาทำถึงขนาดนั้น จึงได้แค่ปรับปรุงเล็กๆน้อยๆไปก่อน
ถึงอย่างนั้นก็ได้ใช้งาน vue.js ทำอะไรเยอะพอสมควร
2. ปรับปรุงเว็บให้เป็น responsive
responsive คือการที่เว็บสามารถแสดงผลให้เหมาะสมตามอุปกรณ์ที่ใช้เข้าชมเว็บ เช่นใช้คอม มือถือ แท็บเล็ต แต่ละอย่างมีความกว้างของหน้าจอไม่เท่ากัน ดังนั้นหน้าเว็บที่แสดงผลได้ดูดีในคอมอาจจะดูลำบากในมือถือ
ก่อนหน้านี้ปกติจะเปิดเว็บด้วยคอมอย่างเดียว ไม่ค่อยได้เปิดด้วยมือถือ จึงไม่ค่อยได้ตระหนักถึงปัญหาตรงนี้ แต่พอมีโอกาสได้เปิดในมือถือจึงรู้ว่ามันควรจะต้องปรับปรุงจริงๆ
วิธีการนั้นก็คือเขียนโค้ด javascript ให้ตรวจดูว่าอุปกรณ์ที่ใช้เป็นมือถือหรือเปล่า ถ้าใช่ก็ให้ปรับความกว้างของหน้าบล็อกให้แคบลง ส่วนเมนูด้านขวาก็ย้ายไปพับอยู่ตรงอักษร 三 ด้านบนแทน เหมือนที่หลายๆเว็บทำกัน
พอเปลี่ยนแบบนี้แล้วสะดวกขึ้นจริงๆ ปกติหน้าเว็บนี้กว้าง 1120px แต่เมื่อเข้าเว็บด้วยมือถือ จอจะถูกปรับความกว้างลงมาเหลือ 457px ทำให้ตัวหนังสือไม่ดูเล็กเกินไป
ในส่วนของโค้ด javascript ที่เขียนนั้นใช้ jquery ร่วมกับ vue.js นี่จึงถือเป็นงานแรกที่ได้เร่ิมใช้ vue.js ในหน้าบล็อก
จริงๆอยากใช้ vue.js ทั้งหมด แต่บางส่วนดูแล้ว jquery ยังสะดวกกว่า อันที่จริงงานนี้ใช้แค่ jquery ก็เพียงพอ
3. เพิ่มระบบค้นหาบทความ
ที่แถบเมนูได้เพิ่มส่วน "ค้นหาบทความ" เพิ่มเข้ามา จากที่เมื่อก่อนไม่มี ตรงนี้เอาไว้หาบทความที่มีหัวข้อตรงกับคำที่ค้น
ถ้าเข้าไปในหน้าค้นหาแล้วพอแก้ข้อความผลการค้นหาก็จะเปลี่ยนตามด้วย อันนี้ใช้ vue.js ทำ
เพียงแต่กำหนดเงื่อนไขไว้ว่าจะค้นได้เมื่อคำที่ค้นยาว ๓ อักษรขึ้นไปเท่านั้น
คิดว่าน่าจะมีประโยชน์เวลาที่ต้องการค้นหาบทความที่ต้องการไม่มากก็น้อย
หน้าค้นจะเข้าจากลิงก์นี้ก็ได้ https://phyblas.hinaboshi.com/khonhana
4. ที่กดเลือกหมวดในแถบเมนู
อีกส่วนเล็กๆที่ใช้ vue.js เขียนเพิ่มเข้ามา คือแถบเลือกเข้าไปดูบทครามแยกตามหมวดต่างๆ สำหรับเลือกดูบทความแยกเป็นหมวดได้ง่ายๆ
ที่ทำเป็น dropdown เนื่องจากจำนวนหมวดมีเยอะ ที่จริงหมวดในที่นี้เป็นเหมือนระบบ tag มากกว่า คือบทความนึงจะถูกจัดอยู่ในหลายๆหมวด
5. เริ่มมีการใส่ฟุริงานะบนข้อความ
ฟุริงานะคืออักษรเล็กๆที่ลอยอยู่บนอักษรหลัก แบบนี้ >> お好み焼き大好き
เดิมทีหมายถึงตัวอักษรฮิรางานะหรือคาตาคานะที่ลอยอยู่บนตัวคันจิเพื่อบอกเสียงอ่าน พบได้บ่อยๆเวลาอ่านหนังสือภาษาญี่ปุ่น
ตัวอย่างจากนิยายญี่ปุ่น ถ้าเขียนอักษรแนวตั้งจะเห็นฟุริงานะอยู่ทางขวาแบบนี้ แต่ถ้าเขียนแนวนอนฟุริงานะจะอยู่ข้างบน ส่วนใหญ่จะใส่เฉพาะคำที่อ่านยาก
แต่นอกจากภาษาญี่ปุ่นแล้วจะสามารถใช้ในภาษาอื่นก็ได้เช่นกัน แม้จะไม่ค่อยเจอ
ดังนั้นตอนนี้จึงตัดสินใจว่าเวลาใส่ข้อความภาษาญี่ปุ่นลงในบล็อกจะใส่ฟุริงานะกำกับด้วย
นอกจากนี้ถ้าเป็นภาษาจีนก็จะใส่พินอิน เช่น 我要吃鐵板燒
มีเสียงอ่านให้ดูแบบนี้น่าจะเป็นประโยชน์ต่อคนที่เข้ามาอ่านมากกว่า
ส่วนคนที่ไม่รู้ภาษาจีนอยากรู้ว่าอ่านออกเสียงหรือถอดเป็นไทยยังไงให้ไปดูที่หน้านี้ได้ https://phyblas.hinaboshi.com/20181019
บทความที่เคยเขียนไปก่อนหน้านี้แล้วก็คงจะไม่ได้ย้อนไปใส่คำอ่านให้ ยกเว้ว่าจะมีเวลา แต่ที่จะเขียนต่อจากนี้ไปจะมีการใส่เท่าที่จะสะดวก
หน้าสารบัญเที่ยวญี่ปุ่นมีการใส่ฟุริงานะไว้ทั้งหมด https://phyblas.hinaboshi.com/saraban/nihon
ส่วนสารบัญบันทึกในไต้หวันก็มีการใส่พินอินไว้ https://phyblas.hinaboshi.com/saraban/taiwan
6. ใช้ qiita API
พอดีว่าเว็บ qiita ซึ่งเป็นเว็บบล็อกของญี่ปุ่นที่ใช้สำหรับเขียนเกี่ยวความรู้ด้านเขียนโปรแกรมโดยเฉพาะนั้นเขามีระบบ API ให้คนดึงข้อมูลบล็อกออกมาทำอะไรต่างๆได้
เราเขียนบล็อกอยู่ที่ qiita ด้วย ตอนนี้มีอยู่ ๙ บทความแล้ว https://qiita.com/phyblas
ดังนั้นก็เลยลองเขียนโค้ javascript สำหรับดึงข้อมูลจาก qiita มาแสดงผลในหน้าเว็บ
เกิดเป็นหน้านี้ขึ้นมา https://phyblas.hinaboshi.com/qiita
อันที่จริงเป็นการทำขึ้นมาด้วยความอยากลองเฉยๆ คงไม่ได้ใช้ประโยชน์อะไรจริงจัง อย่างน้อยก็ได้เป็นการเอาบทความที่ตัวเองเขียนที่อื่นไว้มาแสดงผลในบล็อกนี้ด้วย
7. เพิ่มหน้าแสดงสถิติของเว็บ
ที่สำคัญอย่างสุดท้ายที่ได้ทำไปก่อนปีใหม่ก็คือ ส่วนแสดงผลสถิติที่ทำให้รู้ว่ามีคนเข้าเว็บแต่ละหน้าแค่ไหนในแต่ละช่วงเวลา
ที่จริงแล้วตั้งแต่ย้ายบล็อกมาที่ปัจจุบันนี้ตั้งแต่กรกฎาคม 2017 นั้น ได้มีการเก็บนับจำนวนการเข้าหน้าเว็บต่างๆไว้ตลอด
เพียงแต่ก่อนหน้านี้แค่เก็บจำนวนไว้ก่อน ยังไม่ได้เอาผลมาดู เพราะตอนนั้นยังไม่มีเวลาทำ อีกทั้งสถิติเพิ่งเก็บยังไม่มีอะไรให้แสดงมากนัก
ผ่านไปปีครี่ง ตอนนี้มีสถิติมากมายให้ลองเอามาดูและแสดงผล จึงได้จังหวะที่จะลองเขียนหน้าแสดงผลสถิติขึ้นมาเป็นเรื่องเป็นราว อีกทั้งพอได้ใช้ vue.js แล้วทำให้สามารถเขียนได้สะดวกขึ้น
สถิติแบ่งเป็นรายเดือนและรายหน้า โดยบอกคนเข้ารวมทั้งหมด และจัดอันดับหน้าที่มีคนเข้าเยอะที่สุด
อย่างหน้านี้คือของเดือนธันวาคมปี 2018 https://phyblas.hinaboshi.com/dusathitiraiduean/201812
หน้าที่แสดงผลตรงนี้มีทั้งหน้าบล็อกปกติและหน้าที่เป็นสารบัญปนอยู่ด้วยกัน
ดูแล้วจะเห็นว่าเรื่องโครงข่ายประสาทเทียมและ python ดูจะมาแรงได้รับความสนใจตลอด ส่วนไวยากรณ์ภาษาจีนที่ทำไว้ก็มีคนสนใจมากเช่นกัน ไม่แปลก เพราะภาษาจีนก็สำคัญมากไม่แพ้ภาษา python
มาเรียนภาษาจีนกันเยอะๆ มีประโยชน์แน่นอน https://phyblas.hinaboshi.com/saraban/gakkenzh
ถ้าคลิกที่ตัวเลขทางขวาก็จะดูสถิติรายหน้าของหน้านั้นๆในตลอดเวลาที่ผ่านมาได้
อย่างหน้านี้ของสารบัญไพธอน https://phyblas.hinaboshi.com/dusathiti/สารบัญ/python
ก็แสดงเป็นแท่งแบ่งตามเดือนไว้แบบนี้ ถ้ากดไปที่แต่ละเดือนก็จะแสดงตัวเลขแยกแต่ละวันด้วย
สถิติย้อนไปถึงกรกฎาคม 2017 น่าเสียดายที่ไม่สามารถนำสถิติจากบล็อกเก่ามาแสดงด้วยได้
หน้าสถิตินี้เวลาเข้าแต่ละทีจะมีการดึงข้อมูลค่อนข้างหนัก จึงใช้วิธีการที่ว่าเวลามีคนเข้าไปทีนึงก็บันทึกข้อมูลหน้านั้นไว้ ถ้ามีคนเข้ามาอีกทีในไม่เวลาไม่ถึงชั่วโมงหลังจากนั้นก็ใช้ข้อมูลที่บันทึกไว้ ไม่ต้องเข้าใหม่ ดังนั้นข้อมูลจะปรับปรุงใหม่อย่างมากก็ชั่วโมงละครั้ง
จริงๆแล้วหน้าสถิตินี้ทำเอาไว้ให้ตัวเองดูเป็นหลัก ดังนั้นจึงไม่ได้ใส่ลิงก์ไว้ในหน้าบล็ฮกให้เข้าถึงได้ง่าย ถ้าจะเข้าก็พิมพ์ url เข้าเอา
โดยสรุปแล้วก็มีอยู่เท่านี้ ภาพรวมของบล็อกอาจไม่ได้เปลี่ยนแปลงไปเท่าไหร่ แต่มีอะไรที่ทำให้ใช้งานได้สะดวกขึ้นทีละเล็กน้อย
ตอนสิ้นปีจนถึงวันปีใหม่ได้เห็นบางคนเขียนบันทึกไล่เรียงว่าตัวเองทำอะไรไปบ้างทั้งปี 2018 คิดดูแล้วก็อยากเขียนเหมือนกัน แต่ขอแบ่งเป็นเรื่องๆดีกว่า
หน้านี้เขียนขึ้นเพื่อเป็นการบันทึกเอาไว้ว่าได้มีการทำอะไรไปบ้างในในส่วนของเว็บ ก็ถือเป็นส่วนหนึ่งของการสรุปเรื่องราวปี 2018
1. นำ vue.js มาใช้
สิ่งที่สำคัญที่สุดที่ได้เรียนรู้ในช่วงระหว่างนั้นก็เห็นจะเป็น vue.js นี่เอง ที่จริงรู้จักมานานแล้วแต่ไม่มีโอกาสได้เรียนรู้
vue.js ยังสามารถใช้งานแทน jquery ได้ในหลายๆส่วน เช่นคำสั่งที่มีการคลิกแล้วซ่อนแสดง
หน้าแรกที่ได้ลองเปลี่ยนมาใช้ vue.js ทั้งหมดเพื่อทดสอบก็คือหน้ารายชื่อโปเกมอน https://hinaboshi.com/ruamraichuepokemon
vue.js สามารถทำการวนซ้ำเพื่อนำข้อมูลออกมาไล่เรียงได้ ทำหน้าที่แทนคำสั่งวนซ้ำใน ruby on rails ได้ โค้ดก็ดูสวยสะอาดกว่าด้วย
ที่จริง vue.js มีตัวช่วยสำหรับสร้างเว็บแบบ SPA (single page apllication) อย่าง vue cli ทำให้ตอนแรกก็คิดว่าอยากเปลี่ยนเว็บให้เป็นแบบนั้นดู แต่เมื่อพิจารณาจุดอ่อนของเว็บแบบนี้ตรงที่ว่าจะทำให้การค้นหาใน google เจอได้ยากขึ้น ทำให้เลิกล้มไป
อีกทั้งถ้าจะทำต้องแก้โครงสร้างเว็บใหม่ ยิ่งต้องใช้เวลามาก ยังไม่มีเวลาทำถึงขนาดนั้น จึงได้แค่ปรับปรุงเล็กๆน้อยๆไปก่อน
ถึงอย่างนั้นก็ได้ใช้งาน vue.js ทำอะไรเยอะพอสมควร
2. ปรับปรุงเว็บให้เป็น responsive
responsive คือการที่เว็บสามารถแสดงผลให้เหมาะสมตามอุปกรณ์ที่ใช้เข้าชมเว็บ เช่นใช้คอม มือถือ แท็บเล็ต แต่ละอย่างมีความกว้างของหน้าจอไม่เท่ากัน ดังนั้นหน้าเว็บที่แสดงผลได้ดูดีในคอมอาจจะดูลำบากในมือถือ
ก่อนหน้านี้ปกติจะเปิดเว็บด้วยคอมอย่างเดียว ไม่ค่อยได้เปิดด้วยมือถือ จึงไม่ค่อยได้ตระหนักถึงปัญหาตรงนี้ แต่พอมีโอกาสได้เปิดในมือถือจึงรู้ว่ามันควรจะต้องปรับปรุงจริงๆ
วิธีการนั้นก็คือเขียนโค้ด javascript ให้ตรวจดูว่าอุปกรณ์ที่ใช้เป็นมือถือหรือเปล่า ถ้าใช่ก็ให้ปรับความกว้างของหน้าบล็อกให้แคบลง ส่วนเมนูด้านขวาก็ย้ายไปพับอยู่ตรงอักษร 三 ด้านบนแทน เหมือนที่หลายๆเว็บทำกัน
พอเปลี่ยนแบบนี้แล้วสะดวกขึ้นจริงๆ ปกติหน้าเว็บนี้กว้าง 1120px แต่เมื่อเข้าเว็บด้วยมือถือ จอจะถูกปรับความกว้างลงมาเหลือ 457px ทำให้ตัวหนังสือไม่ดูเล็กเกินไป
ในส่วนของโค้ด javascript ที่เขียนนั้นใช้ jquery ร่วมกับ vue.js นี่จึงถือเป็นงานแรกที่ได้เร่ิมใช้ vue.js ในหน้าบล็อก
จริงๆอยากใช้ vue.js ทั้งหมด แต่บางส่วนดูแล้ว jquery ยังสะดวกกว่า อันที่จริงงานนี้ใช้แค่ jquery ก็เพียงพอ
3. เพิ่มระบบค้นหาบทความ
ที่แถบเมนูได้เพิ่มส่วน "ค้นหาบทความ" เพิ่มเข้ามา จากที่เมื่อก่อนไม่มี ตรงนี้เอาไว้หาบทความที่มีหัวข้อตรงกับคำที่ค้น
ถ้าเข้าไปในหน้าค้นหาแล้วพอแก้ข้อความผลการค้นหาก็จะเปลี่ยนตามด้วย อันนี้ใช้ vue.js ทำ
เพียงแต่กำหนดเงื่อนไขไว้ว่าจะค้นได้เมื่อคำที่ค้นยาว ๓ อักษรขึ้นไปเท่านั้น
คิดว่าน่าจะมีประโยชน์เวลาที่ต้องการค้นหาบทความที่ต้องการไม่มากก็น้อย
หน้าค้นจะเข้าจากลิงก์นี้ก็ได้ https://phyblas.hinaboshi.com/khonhana
4. ที่กดเลือกหมวดในแถบเมนู
อีกส่วนเล็กๆที่ใช้ vue.js เขียนเพิ่มเข้ามา คือแถบเลือกเข้าไปดูบทครามแยกตามหมวดต่างๆ สำหรับเลือกดูบทความแยกเป็นหมวดได้ง่ายๆ
ที่ทำเป็น dropdown เนื่องจากจำนวนหมวดมีเยอะ ที่จริงหมวดในที่นี้เป็นเหมือนระบบ tag มากกว่า คือบทความนึงจะถูกจัดอยู่ในหลายๆหมวด
5. เริ่มมีการใส่ฟุริงานะบนข้อความ
ฟุริงานะคืออักษรเล็กๆที่ลอยอยู่บนอักษรหลัก แบบนี้ >> お好み焼き大好き
เดิมทีหมายถึงตัวอักษรฮิรางานะหรือคาตาคานะที่ลอยอยู่บนตัวคันจิเพื่อบอกเสียงอ่าน พบได้บ่อยๆเวลาอ่านหนังสือภาษาญี่ปุ่น
ตัวอย่างจากนิยายญี่ปุ่น ถ้าเขียนอักษรแนวตั้งจะเห็นฟุริงานะอยู่ทางขวาแบบนี้ แต่ถ้าเขียนแนวนอนฟุริงานะจะอยู่ข้างบน ส่วนใหญ่จะใส่เฉพาะคำที่อ่านยาก
แต่นอกจากภาษาญี่ปุ่นแล้วจะสามารถใช้ในภาษาอื่นก็ได้เช่นกัน แม้จะไม่ค่อยเจอ
ดังนั้นตอนนี้จึงตัดสินใจว่าเวลาใส่ข้อความภาษาญี่ปุ่นลงในบล็อกจะใส่ฟุริงานะกำกับด้วย
นอกจากนี้ถ้าเป็นภาษาจีนก็จะใส่พินอิน เช่น 我要吃鐵板燒
มีเสียงอ่านให้ดูแบบนี้น่าจะเป็นประโยชน์ต่อคนที่เข้ามาอ่านมากกว่า
ส่วนคนที่ไม่รู้ภาษาจีนอยากรู้ว่าอ่านออกเสียงหรือถอดเป็นไทยยังไงให้ไปดูที่หน้านี้ได้ https://phyblas.hinaboshi.com/20181019
บทความที่เคยเขียนไปก่อนหน้านี้แล้วก็คงจะไม่ได้ย้อนไปใส่คำอ่านให้ ยกเว้ว่าจะมีเวลา แต่ที่จะเขียนต่อจากนี้ไปจะมีการใส่เท่าที่จะสะดวก
หน้าสารบัญเที่ยวญี่ปุ่นมีการใส่ฟุริงานะไว้ทั้งหมด https://phyblas.hinaboshi.com/saraban/nihon
ส่วนสารบัญบันทึกในไต้หวันก็มีการใส่พินอินไว้ https://phyblas.hinaboshi.com/saraban/taiwan
6. ใช้ qiita API
พอดีว่าเว็บ qiita ซึ่งเป็นเว็บบล็อกของญี่ปุ่นที่ใช้สำหรับเขียนเกี่ยวความรู้ด้านเขียนโปรแกรมโดยเฉพาะนั้นเขามีระบบ API ให้คนดึงข้อมูลบล็อกออกมาทำอะไรต่างๆได้
เราเขียนบล็อกอยู่ที่ qiita ด้วย ตอนนี้มีอยู่ ๙ บทความแล้ว https://qiita.com/phyblas
ดังนั้นก็เลยลองเขียนโค้ javascript สำหรับดึงข้อมูลจาก qiita มาแสดงผลในหน้าเว็บ
เกิดเป็นหน้านี้ขึ้นมา https://phyblas.hinaboshi.com/qiita
อันที่จริงเป็นการทำขึ้นมาด้วยความอยากลองเฉยๆ คงไม่ได้ใช้ประโยชน์อะไรจริงจัง อย่างน้อยก็ได้เป็นการเอาบทความที่ตัวเองเขียนที่อื่นไว้มาแสดงผลในบล็อกนี้ด้วย
7. เพิ่มหน้าแสดงสถิติของเว็บ
ที่สำคัญอย่างสุดท้ายที่ได้ทำไปก่อนปีใหม่ก็คือ ส่วนแสดงผลสถิติที่ทำให้รู้ว่ามีคนเข้าเว็บแต่ละหน้าแค่ไหนในแต่ละช่วงเวลา
ที่จริงแล้วตั้งแต่ย้ายบล็อกมาที่ปัจจุบันนี้ตั้งแต่กรกฎาคม 2017 นั้น ได้มีการเก็บนับจำนวนการเข้าหน้าเว็บต่างๆไว้ตลอด
เพียงแต่ก่อนหน้านี้แค่เก็บจำนวนไว้ก่อน ยังไม่ได้เอาผลมาดู เพราะตอนนั้นยังไม่มีเวลาทำ อีกทั้งสถิติเพิ่งเก็บยังไม่มีอะไรให้แสดงมากนัก
ผ่านไปปีครี่ง ตอนนี้มีสถิติมากมายให้ลองเอามาดูและแสดงผล จึงได้จังหวะที่จะลองเขียนหน้าแสดงผลสถิติขึ้นมาเป็นเรื่องเป็นราว อีกทั้งพอได้ใช้ vue.js แล้วทำให้สามารถเขียนได้สะดวกขึ้น
สถิติแบ่งเป็นรายเดือนและรายหน้า โดยบอกคนเข้ารวมทั้งหมด และจัดอันดับหน้าที่มีคนเข้าเยอะที่สุด
อย่างหน้านี้คือของเดือนธันวาคมปี 2018 https://phyblas.hinaboshi.com/dusathitiraiduean/201812
หน้าที่แสดงผลตรงนี้มีทั้งหน้าบล็อกปกติและหน้าที่เป็นสารบัญปนอยู่ด้วยกัน
ดูแล้วจะเห็นว่าเรื่องโครงข่ายประสาทเทียมและ python ดูจะมาแรงได้รับความสนใจตลอด ส่วนไวยากรณ์ภาษาจีนที่ทำไว้ก็มีคนสนใจมากเช่นกัน ไม่แปลก เพราะภาษาจีนก็สำคัญมากไม่แพ้ภาษา python
มาเรียนภาษาจีนกันเยอะๆ มีประโยชน์แน่นอน https://phyblas.hinaboshi.com/saraban/gakkenzh
ถ้าคลิกที่ตัวเลขทางขวาก็จะดูสถิติรายหน้าของหน้านั้นๆในตลอดเวลาที่ผ่านมาได้
อย่างหน้านี้ของสารบัญไพธอน https://phyblas.hinaboshi.com/dusathiti/สารบัญ/python
ก็แสดงเป็นแท่งแบ่งตามเดือนไว้แบบนี้ ถ้ากดไปที่แต่ละเดือนก็จะแสดงตัวเลขแยกแต่ละวันด้วย
สถิติย้อนไปถึงกรกฎาคม 2017 น่าเสียดายที่ไม่สามารถนำสถิติจากบล็อกเก่ามาแสดงด้วยได้
หน้าสถิตินี้เวลาเข้าแต่ละทีจะมีการดึงข้อมูลค่อนข้างหนัก จึงใช้วิธีการที่ว่าเวลามีคนเข้าไปทีนึงก็บันทึกข้อมูลหน้านั้นไว้ ถ้ามีคนเข้ามาอีกทีในไม่เวลาไม่ถึงชั่วโมงหลังจากนั้นก็ใช้ข้อมูลที่บันทึกไว้ ไม่ต้องเข้าใหม่ ดังนั้นข้อมูลจะปรับปรุงใหม่อย่างมากก็ชั่วโมงละครั้ง
จริงๆแล้วหน้าสถิตินี้ทำเอาไว้ให้ตัวเองดูเป็นหลัก ดังนั้นจึงไม่ได้ใส่ลิงก์ไว้ในหน้าบล็ฮกให้เข้าถึงได้ง่าย ถ้าจะเข้าก็พิมพ์ url เข้าเอา
โดยสรุปแล้วก็มีอยู่เท่านี้ ภาพรวมของบล็อกอาจไม่ได้เปลี่ยนแปลงไปเท่าไหร่ แต่มีอะไรที่ทำให้ใช้งานได้สะดวกขึ้นทีละเล็กน้อย