ข้อดีและข้อเสียของการสร้างเว็บแอปพลิเคชันหน้าเดียว [ปิด]

ฉันใกล้จะสิ้นสุดการสร้างต้นแบบ / พิสูจน์เฟสแนวคิดสำหรับโครงการด้านที่ฉันกำลังทำงานและพยายามตัดสินใจเกี่ยวกับการตัดสินใจออกแบบแอปพลิเคชันขนาดใหญ่ขึ้น แอพนี้เป็นระบบการจัดการโครงการที่ปรับให้เข้ากับกระบวนการพัฒนาที่คล่องตัวยิ่งขึ้น หนึ่งในการตัดสินใจที่ฉันต้องทำคือเลือกว่าจะใช้แอปพลิเคชั่นหลายหน้าแบบดั้งเดิมหรือแอปพลิเคชันหน้าเดียว

ปัจจุบันต้นแบบของฉันคือการตั้งค่าแบบหลายหน้าแบบดั้งเดิม แต่ฉันได้ดู backbone.js เพื่อล้างข้อมูลและใช้โครงสร้างบางอย่างกับโค้ด Javascript (jQuery) ของฉัน ดูเหมือนว่าในขณะที่ backbone.js สามารถใช้ในแอปพลิเคชันแบบหลายหน้าได้ ฉันกำลังพยายามหารายการข้อดีและข้อเสียของการใช้วิธีการออกแบบแอปพลิเคชันหน้าเดียว จนถึงตอนนี้ฉันมี:

ข้อดี

• ข้อมูลทั้งหมดจะต้องพร้อมใช้งานผ่าน API บางประเภท - นี่เป็นข้อได้เปรียบที่ยิ่งใหญ่สำหรับกรณีการใช้งานของฉันเนื่องจากฉันต้องการมี API สำหรับแอปพลิเคชันของฉันอยู่ดี ตอนนี้ประมาณ 60-70% ของการโทรของฉันเพื่อรับ / อัปเดตข้อมูลจะกระทำผ่าน REST API การใช้แอปพลิเคชันหน้าเดียวจะทำให้ฉันทดสอบ REST API ของฉันได้ดีขึ้นเนื่องจากแอปพลิเคชันนั้นจะใช้งาน นอกจากนี้ยังหมายความว่าเมื่อแอปพลิเคชันเติบโตขึ้น API ของตัวเองจะเพิ่มขึ้นเนื่องจากเป็นสิ่งที่แอปพลิเคชันใช้ ไม่จำเป็นต้องเก็บรักษา API ไว้เป็นส่วนเสริมของแอปพลิเคชัน

• แอปพลิเคชันที่ตอบสนองได้ดีขึ้น - เนื่องจากข้อมูลทั้งหมดที่โหลดหลังจากหน้าเริ่มต้นถูกเก็บไว้ในระดับต่ำสุดและส่งในรูปแบบกะทัดรัด (เช่น JSON) การร้องขอข้อมูลโดยทั่วไปควรจะเร็วกว่าและเซิร์ฟเวอร์จะประมวลผลน้อยลงเล็กน้อย

ข้อเสีย

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

นอกจากนี้ยังมีสิ่งอื่น ๆ ที่เป็นดาบสองคม ตัวอย่างเช่นด้วยแอปพลิเคชันหน้าเดียวข้อมูลที่ประมวลผลสำหรับแต่ละคำขออาจน้อยลงมากเนื่องจากแอปพลิเคชันจะขอข้อมูลขั้นต่ำที่จำเป็นสำหรับคำขอเฉพาะอย่างไรก็ตามมันก็หมายความว่าอาจมีคำขอขนาดเล็กมากขึ้น เซิฟเวอร์. ฉันไม่แน่ใจว่าเป็นสิ่งที่ดีหรือไม่ดี

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

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

เท่าที่ทำซ้ำรหัสหรือวางตรรกะทางธุรกิจกับลูกค้า - ฉันไม่แน่ใจว่าคุณต้องทำอะไร หากโมเดลบนไคลเอ็นต์เป็น View-Model (โมเดลที่ตรงกับโลกตามที่ UI เห็นไม่ใช่โมเดลธุรกิจ) ดังนั้นตรรกะที่ตรงกับ ViewModel ถึงโมเดลธุรกิจสามารถอยู่บนไคลเอ็นต์ได้ เซิร์ฟเวอร์หรือทั้งสองอย่าง ขึ้นอยู่กับว่าคุณรู้สึกอย่างไรเกี่ยวกับการมี API ของคุณประกอบด้วยซุ้มเฉพาะลูกค้าเทียบกับการที่ลูกค้าแปลอินพุต UI เป็นการเรียก API

คุณอาจต้องการที่จะดูที่ knockout.js ฉันไม่สามารถบอกได้ว่ามันดีกว่ากระดูกสันหลัง แต่มันอาจเหมาะกับโครงการของคุณดีกว่า

ข้อเสียที่ฉันมักจะเห็นในแอปพลิเคชันเว็บหน้าเดียว:

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

(มือถือโดยเฉพาะ :)

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

สิ่งเหล่านี้สามารถแก้ไขได้ แต่จากสิ่งที่ฉันเห็นผู้สร้างไซต์ส่วนใหญ่ทำไม่ได้

มีลูกค้าคนหนึ่งที่สำคัญทั้งหมดที่ไม่เคยทำงานเป็น Javascript: Google ตีนตะขาบ(เป็นของปี 2012) (Bing ไม่ได้เรียกใช้ JS เช่นกันฉันคิดว่า)

คุณจะต้องจัดทำรุ่นที่ไม่ใช่ AJAX ที่สมเหตุสมผลสำหรับทุกหน้าซึ่งจะต้องมีการจัดทำดัชนีหรือลิงค์ไปยังหน้าเว็บที่จำเป็นต้องจัดทำดัชนี

หากไซต์ของคุณมีขนาดเล็กคุณสามารถจัดเตรียมเวอร์ชันพื้นฐานของหน้าเว็บเพียงไม่กี่หน้าสำหรับบอตการจัดทำดัชนี

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

หากไม่ใช่สิ่งเหล่านี้คุณน่าจะพัฒนาเว็บไซต์ได้หลายหน้าตั้งแต่เริ่มต้นและให้การอัปเดต AJAX ที่ไม่เปลี่ยน 'วัตถุประสงค์ทั่วไป' ของหน้า

-Duplication of code - ตัวอย่างเช่น code model ฉันจะต้องสร้างแบบจำลองทั้งในฝั่งเซิร์ฟเวอร์ (PHP ในกรณี) และฝั่งเซิร์ฟเวอร์ในจาวาสคริปต์

คุณอยู่ในโลก PHP แต่มีกลยุทธ์การสร้างรหัสใน. NET โลกสำหรับการสร้างพร็อกซี่ JavaScript WCF โดยอัตโนมัติ ดูที่นี่

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

ตัวเลือกไม่จำเป็นต้องเป็นอย่างใดอย่างหนึ่ง JWtเป็นตัวอย่างชุดเครื่องมือเว็บที่ใช้ภาพลวงตาที่สมบูรณ์แบบของหน้าเว็บหลายหน้า แต่มันเป็นหน้าเดียว นอกจากนี้มันจะรู้จักบอทและเบราว์เซอร์ของ Google ที่ไม่มี javascript (ลองใช้) และเปลี่ยนไปใช้รูปแบบหลายหน้าแบบดั้งเดิมเมื่อตรวจพบได้

ในระยะสั้น:

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