Helpex - Trao đổi & giúp đỡ Đăng nhập
5

Tôi đang xây dựng một WebApp, toàn bộ dự án đều dựa trên AngularJSPHP(như là phần phụ trợ), tôi đang ở phần cuối cùng, cung cấp cho nó những bước hoàn thiện cuối cùng, thử nghiệm, v.v. Tôi không biết có nên kết hợp hay không tất cả .jscác tệp của tôi thành một. Tôi hỏi điều này bởi vì tôi đang sử dụng rất nhiều mã do tôi tự viết, cũng như các thư viện phần thứ ba, chẳng hạn như mặt nạ biểu mẫu, hộp thoại, vật liệu góc cạnh, v.v.

Tôi có cấu trúc 2 trang, một distthư mục cho các .jstệp được rút gọn cuối cùng và một srcthư mục nơi tôi có mọi thứ trong lành.

src                                     dist
├── app                                 ├── js
│   ├── .app-ctrl.js                    │   ├── .app.min.js
│   ├── .app-dire.js                    │   ├── .angular.min.js
│   └── .app-fact.js                    │   └── .angular-animate.min.js
│   └── .app-main.js                    │   └── .angular-material.min.js
└── js                                  │   └── .[...etc...].min.js
│    ├── .angular.min.js                └── lib
│    ├── .angular-animate.min.js            ├── .ngDialog.min.js
│    └── .angular-material.min.js           ├── .ngMask.min.js
│    └── .[...etc...].min.js                └── .[...etc...].min.js
└── lib
    ├── .ngDialog.min.js
    ├── .ngMask.min.js
    └── .[...etc...].min.js

Sau đó, trong htmltệp của tôi, tôi đang tải từng tệp này, như sau:

<!-- Main Scripts -->
<script src="dist/js/app.min.js"></script>
<script src="dist/js/angular.min.js"></script>
<script src="dist/js/angular-router.min.js"></script>
[..etc..]

<!-- Lib Scripts -->
<script src="dist/lib/ngMask.min.js"></script>
<script src="dist/lib/ngDialog.min.js"></script>
<script src="dist/lib/ngNotification.min.js"></script>
[...etc...]

Nghi ngờ lớn nhất của tôi là về sự kết hợp của tất cả các tệp này.

Nó có được khuyến khích để làm điều đó không?
Tôi nên nối các tệp nào? Bởi vì tôi biết góc cạnh là một thư viện lớn, và không nên đồng nhất với những cái khác (ít nhất là tôi sẽ không làm điều đó). Nhưng có những cái khác, những cái nhỏ hơn.

Vì tôi là người dùng mới AngularJs(cũng như trong javascript, chỉ dựa trên những gì tôi đã học được Angular) lợi ích của việc làm như vậy là gì? Nó có mang lại hiệu suất tốt hơn không? Bảo mật tốt hơn cho mã của tôi?

Tôi nên làm gì để làm cho những điều đó tốt hơn?
Đây là những câu hỏi quan trọng mà tôi muốn biết để tạo sự phát triển tốt hơn và cũng là mã acabamento tốt hơn cho ứng dụng của tôi.


Biên tập

Tôi đã đọc thêm về điều này và tôi cũng tìm thấy tùy chọn cho obfuscatemã, ngoài việc làm cho mã an toàn hơn. Tôi thậm chí đã tìm thấy plugin npm này grunt-obfuscator , nhưng nó không hoạt động. Theo như tôi biết, nó không hoạt động với AngularJS. Có cách nào khác để làm điều đó không? Để làm xáo trộn mã hoặc làm cho nó an toàn hơn?

5 hữu ích 2 bình luận 2.2k xem chia sẻ
1

Trừ khi bạn muốn sử dụng CDN, bạn nên ghép nối nếu bạn có một ứng dụng duy nhất. Các phụ thuộc Angular sẽ vô dụng nếu không có các tập lệnh ứng dụng và ngược lại. Không quan trọng nếu chúng là thư viện lõi, thư viện của bên thứ ba hay mã của riêng bạn.

Mối quan tâm chính là tốc độ tải (một tệp js lớn sẽ được tải xuống nhanh hơn). Trong trường hợp này, bạn không cần phải làm gì xa hơn ngoài việc nối đơn thuần, chỉ cần làm theo thứ tự mà các tệp js được tải. Làm điều đó với Grunt , Gulp hoặc bất kỳ công cụ nào khác .

Mọi thứ trở nên khác biệt nếu có một số tập hợp các tệp js có thể được tải và một số phần ứng dụng phụ thuộc vào một số phần khác, nhưng không phải tất cả. Trong trường hợp này phải có một số tệp được nối. Việc ghép nối thủ công ở đây không hiệu quả, nhưng các gói mô-đun thì thông qua các gói / khối. Browserify , RequiJS , JSPMWebpack đều có khả năng làm được điều đó.

1 hữu ích 4 bình luận chia sẻ
loading
Không tìm thấy câu trả lời bạn tìm kiếm? Duyệt qua các câu hỏi được gắn thẻ angularjs , hoặc hỏi câu hỏi của bạn.

Có thể bạn quan tâm

loading