2012-08-07 34 views
13

Tôi đang tạo một ứng dụng javascript. Thông thường những gì tôi làm là tạo các mô-đun khác nhau và nhận người dùng nhập hoặc nhấp vào các sự kiện trong hàm $(document).ready();. Điều này làm việc tốt cho các ứng dụng nhỏ. Nhưng khi tôi làm theo cùng một mẫu, tôi có nghĩa là nhận được các sự kiện nhấp chuột trong $(document).ready(); sau đó nó bị lộn xộn.Tổ chức mã javascript

Vậy làm cách nào để sắp xếp tệp này cho một ứng dụng lớn?

Cảm ơn trước

+3

Tôi kính trọng không đồng ý với phiếu giảm giá; bạn phải bắt đầu từ đâu đó. Nhưng al0ne có thể xem xét mở rộng câu hỏi để hiển thị thông qua mã nơi "ngưỡng lộn xộn" đang xảy ra. – cantera

+1

@ cantera25 Nó có ý nghĩa. Bởi lộn xộn tôi có nghĩa là mã có thể đạt hơn một nghìn dòng trong tập tin duy nhất. Tôi không muốn điều đó. – 2619

Trả lời

12

Các đơn tốt nhất tài nguyên tôi đã tìm thấy về chủ đề này là commons cuốn sách sáng tạo Addy Osmani của, Patterns for Large-Scale JavaScript Application Architecture. Nó dựa trên một phần của Nicholas Zakas 'Scalable JavaScript Application Architecture, thích nghi nó với các mẫu thiết kế cổ điển và một quy trình làm việc hiện đại.

Khi bạn đạt đến mức độ phức tạp vừa phải, bạn sẽ được hưởng lợi khi làm việc với một khung được xây dựng bằng cách sử dụng biến thể của mẫu kiến ​​trúc MVC. Backbone.js là frontrunner và là một khuôn khổ vi mô, có nghĩa là nó ít nắm tay hơn những người khác. Các lựa chọn phổ biến khác là Ember.js, KnockoutJS.

Tiện ích mở rộng và nồi hơi cũng được xây dựng trên các khung công tác này để xử lý các tác vụ lặp lại như gắn kết dữ liệu/mô hình và giàn giáo. Đối với Backbone, hãy xem Backbone.Marionette từ Derick Bailey và Backbone Aura, một mô hình kiến ​​trúc Osmani/Zakas không sẵn sàng cho sản xuất được xây dựng bằng cách sử dụng Backbone như ... xương sống của nó.

6

JavaScript là ngôn ngữ kịch bản, cấu trúc là một trong những mối quan tâm quan trọng nhất trong các dự án Javascript quy mô lớn. Điều quan trọng là các phần của ứng dụng của bạn được tách riêng và 'tự chứa'. Ví dụ, bạn có thể tạo các thành phần giao diện người dùng của riêng bạn có mẫu, logic, kiểu, bản địa hóa riêng, v.v. trong một thư mục duy nhất. Việc tự ngăn chặn như vậy sẽ cho phép bạn sắp xếp mã kết thúc trước phức tạp của mình theo cách có thể quản lý được.

Khi bạn có mã của mình được sắp xếp và tự chứa, có những mối quan tâm khác mà bạn cần phải giải quyết.

  • Làm thế nào nên các thành phần lỏng tương tác với khớp nối chặt chẽ ra
  • Làm thế nào tôi nên tối ưu hóa các bộ phận cá nhân để tải nhanh trong env sản xuất của tôi

Tôi là tác giả của kiến ​​trúc tham khảo BoilerplateJS cho ứng dụng quy mô lớn.

http://boilerplatejs.org

Nó kết hợp hầu hết các thực hành tốt nhất được thảo luận trong Nicholas Zakas'presentation. Bạn sẽ tìm thấy một mẫu thực hiện của một bộ sản phẩm mô-đun trong mã là tốt. Có một cái nhìn, bạn sẽ hiểu những mối quan tâm bạn sẽ cần phải chú ý trong việc thực hiện một ứng dụng quy mô lớn với JavaScript.