Việc sử dụng Processing.js của John Resig có hợp lý không?

Question

Tôi đang suy nghĩ về việc tạo một trang web với một số sử dụng JavaScript/canvas khá mãnh liệt và tôi đã xem xét Processing.js và có vẻ như với tôi rằng nó sẽ làm cho thao tác canvas dễ dàng hơn nhiều. Có ai biết bất kỳ lý do nào tại sao tôi không nên sử dụng Processing.js? Tôi hiểu rằng các trình duyệt cũ hơn sẽ không thể sử dụng nó, nhưng bây giờ thì không sao.

Answer 1

Như đã đề cập, IE không được hỗ trợ bởi Processing.js (bao gồm cả IE8 beta). Tôi cũng đã tìm thấy tệp processing.js hơi chậm về mặt hiệu suất, so với chỉ sử dụng canvas (đặc biệt nếu bạn đang phân tích một chuỗi bằng ngôn ngữ Xử lý, thay vì sử dụng API javascript).

Cá nhân tôi thích API canvas hơn trình bao bọc xử lý vì nó cho phép tôi kiểm soát nhiều hơn. Ví dụ:

Các dây chuyền chế biến() chức năng được thực hiện như thế này (khoảng):

function line (x1, y1, x2, y2) { 
    context.beginPath(); 
    context.moveTo(x1, y1); 
    context.lineTo(x2, y2); 
    context.closePath(); 
    context.stroke(); 
}; 

Và bạn muốn sử dụng nó như thế này (giả sử bạn đang sử dụng API javascript tiếp xúc):

var p = Processing("canvas") 
p.stroke(255) 

////Draw lines.../// 
p.line(0,0,10,10) 
p.line(10,10,20,10) 
//...and so on 
p.line(100,100,200,200) 
////End lines//// 

Chú ý rằng mỗi dòng() gọi phải mở và đóng một con đường mới, trong khi với các API vải bạn có thể vẽ tất cả các dòng trong một khối beginPath/endPath duy nhất, cải thiện hiệu suất đáng kể:

context.strokeStyle = "#fff"; 
context.beginPath(); 

////Draw lines.../// 
context.moveTo(0, 0); 
context.lineTo(10, 10); 
context.lineTo(20, 10); 
//...so on 
context.lineTo(200, 200); 
////End lines.../// 

context.closePath(); 
context.stroke(); 

Answer 2

Nếu bạn đồng ý với nó không hoạt động trong IE7, hãy tiếp tục. Tôi đã có nó làm việc trong Firefox 3. Đó là một cách khéo léo để mang lại hiệu ứng Silverlight/Flash cho trang của bạn.

Linh cảm của tôi là các thư viện như Processing.js sẽ thay đổi hoặc được nâng cấp trên đường dẫn nhanh, vì vậy hãy sẵn sàng chạy khi chúng thực hiện và theo kịp các tính năng mới.

Answer 3

Tôi muốn sử dụng Flash thay thế. Nhiều trình duyệt hơn đã cài đặt Flash, so với số lượng trình duyệt hoạt động với processing.js. Ngoài ra, bạn sẽ nhận được hiệu suất tốt hơn nhiều từ Flash so với sử dụng JavaScript (ít nhất là bây giờ, mặc dù có các dự án trong các công trình để tăng tốc JS rất nhiều, nhưng vẫn còn một số cách nhỏ)

Answer 4

Nó doesn ' t đơn giản hóa bản vẽ trên canvas của bạn. Những gì nó làm là đơn giản hóa nhiệm vụ của hoạt hình nếu bạn đang sử dụng canvas. Nếu bạn đang thực hiện hoạt ảnh và bạn không quan tâm đến hỗ trợ trình duyệt hoàn chỉnh thì hãy sử dụng Processing.js. Nếu bạn không làm hoạt hình (ví dụ: nếu bạn đang làm biểu đồ hoặc các góc tròn) thì đừng thêm phí trên của Processing.js.

Dù bằng cách nào, tôi khuyên bạn nên tìm hiểu cách sử dụng API canvas trực tiếp. Hiểu về api canvas, đặc biệt là các phép biến đổi, sẽ giúp bạn rất nhiều ngay cả khi bạn đang sử dụng Processing.js.

Answer 5

Hãy thử thực hiện javascript mới p5js p5js.org

Oh và để đáp ứng với câu trả lời của Leo, bạn thực sự không cần phải sử dụng dòng chức năng trong chế biến hoặc p5js, có riêng beingShape và Hàm bePath tương tự như canvas api.