2014-11-25 16 views
15

Tôi đo hiệu suất trang web của mình trên cơ sở đối tượng hiệu suất do HTML5 cung cấp và tôi muốn biết rằng điều gì đang xảy ra với ứng dụng của mình, tôi cũng muốn ghi lại hiệu suất này đối tượng của người dùng cuối khác trong cơ sở dữ liệu cục bộ của tôi để tôi có thông tin từ phía họ, nhưng tôi không hoàn toàn quen thuộc với ý nghĩa của mọi tài sản, như những gì có thể là nguyên nhân gây chậm trễ trong connectStart, connectEnd ... Tôi đã tạo bản đồ theo kiến ​​thức của tôi nhưng tôi cần đầu vào từ cộng đồng cho điều này ... điều này sẽ khá hữu ích để những người khác biết được như vậyĐo hiệu suất JS bằng cách sử dụng hiệu suất của HTML5 và đối tượng hiệu suất.tự động

var issueList = { 
    'connectStart':   'Network issue', 
    'connectEnd':   'Server is not responding fast with SSL handshake', 
    'domainLookupStart': 'Network issue', 
    'domainLookupEnd':  'Network issue', 
    'fetchStart':   'Slow browser', 
    'redirectStart':  'Network issue', 
    'redirectEnd':   'Busy server', 
    'requestStart':   'Network issue', 
    'responseStart':  'Server is slow', 
    'domLoading':   'Low internet bandwidth', 
    'unloadEventStart':  'Slow browser', 
    'unloadEventEnd':  'Slow browser, browser processes are too heavy', 
    'navigationStart':  'Slow browser', 
    'responseEnd':   'Network issue', 
    'domInteractive':  'Browser issue', 
    'domContentLoadedEventStart': 'Network issue', 
    'domContentLoadedEventEnd':  'Network issue', 
    'domComplete':   'Too much DOM manipulation', 
    'loadEventStart':  'Unknown', 
    'loadEventEnd':   'Low JS performance, either not optimized JS or browser is slow' 
}; 

Trình tự của quá trình được hiển thị trong hình ảnh này thông tin Perfromance Timing Overview

Tôi cũng đã tạo ra một JSFiddle cho

Cùng cách này, tôi cũng muốn để đo hiệu suất yêu cầu AJAX trong trang web của tôi và tôi đang nghĩ đến việc sử dụng readyState của yêu cầu AJAX Vì vậy, tôi muốn biết những gì có thể là lý do có dành thời gian giữa mỗi thay đổi trạng thái

State Description      Reason 
0  The request is not initialized Slow JS execution 
1  The request has been set up  Slow JS execution 
2  The request has been sent  Slow Netowkr Connection 
3  The request is in process  Slow Server response 
4  The request is complete   Slow server processing 

lý do đằng sau tôi muốn làm điều này là bởi vì, Đôi khi chúng tôi đã nhận đơn khiếu nại rằng ứng dụng tổn của chúng tôi ion là một chút chậm, Vì vậy, trong những trường hợp chúng ta có thể đọc đối tượng hiệu suất của người dùng đó và cũng đọc đối tượng hiệu suất tổng thể . chúng tôi cũng có thể đọc các đối tượng hiệu suất khác nhau trong khi sử dụng tối đa ứng dụng của chúng tôi và thời gian khác là tốt và muốn đo lường mà một phần của ứng dụng mất nhiều thời gian hơn để tải. tại đồng thời nó là một sản phẩm sẽ phát triển theo thời gian để để tham khảo trong tương lai, tôi cũng có thể sử dụng dữ liệu này làm điểm chuẩn. vì vậy chỉ tập trung của tôi là sự hiểu biết đối tượng này hoàn toàn

Ngoài ra, Đừng cho tôi biết nếu có những cách khác (Nếu tôi tham gia đường dài) ...

+1

có một cái nhìn tại .http: //www.html5rocks.com/en/tutorials/webperformance/basics/ –

+1

http://kaaes.github.io/timing –

Trả lời

3

Tôi cũng muốn đăng nhập những đối tượng hiệu suất của người dùng cuối khác trong cơ sở dữ liệu cục bộ của tôi

Hãy bắt đầu với khía cạnh này. Bạn không cần phải tự mình tái tạo lại điều này. Thời gian của bạn tốt hơn nhiều so với việc thực sự cải thiện trang web của bạn, thay vì tạo giải pháp giám sát của riêng bạn.

Google Analytics thực sự theo dõi đối tượng thời gian cho bạn, vì vậy bạn chỉ có thể kiểm tra ở đó. New Relic cũng thực hiện điều này và nhiều nhà phát triển tập trung hơn nữa, theo dõi các mặt của phía máy chủ. Có thể có 100 người khác bạn có thể chọn.

nhưng tôi không hoàn toàn quen thuộc với những gì mọi tài sản có nghĩa

Định nghĩa kinh điển cho những là khuyến cáo của W3C: https://www.w3.org/TR/navigation-timing/

tôi đã tạo ra một bản đồ theo hiểu biết của tôi nhưng Tôi cần đầu vào từ cộng đồng cho số này

Tôi đề xuất không tạo một bản đồ như vậy, ít nhất theo cách bạn đã xác định nó cho đến nay. Mỗi sự kiện có nghĩa là một cái gì đó cụ thể. Giả sử rằng một chuyển hướng có bất cứ điều gì để làm với một vấn đề mạng hoặc máy chủ bận rộn không có ý nghĩa. Chắc chắn, chuyển hướng chậm có thể là do các mục này ... nhưng có thể là do 100 thứ khác hoặc thậm chí có thể dự định. Ngoài ra, hãy xem xét rằng các điều kiện mạng khác nhau trên toàn thế giới. Tóm lại, các định nghĩa như là là tốt nhất.

Nếu bạn có câu hỏi cụ thể về ý nghĩa và nếu thông số W3C không đủ rõ ràng cho bạn, tôi khuyên bạn nên đặt câu hỏi cụ thể về một mục cụ thể mà bạn đang nhầm lẫn.

+0

Lý do đằng sau tôi muốn làm điều này là bởi vì, Đôi khi chúng tôi nhận được đơn khiếu nại rằng ứng dụng của chúng tôi đang chậm một chút, Vì vậy, trong những trường hợp đó, chúng tôi có thể đọc đối tượng hiệu suất của người dùng đó và cũng đọc đối tượng hiệu suất tổng thể. chúng tôi cũng có thể đọc các đối tượng hiệu suất khác nhau trong khi sử dụng tối đa ứng dụng của chúng tôi và thời gian khác là tốt và muốn đo lường phần nào của ứng dụng mất nhiều thời gian hơn để tải. đồng thời nó là một sản phẩm sẽ phát triển với thời gian để tham khảo trong tương lai, tôi cũng có thể sử dụng dữ liệu này làm điểm chuẩn. Vì vậy, trọng tâm duy nhất của tôi là hiểu đối tượng này hoàn toàn –

+0

@ParagBhayani Vâng, rất tốt khi xem hiệu suất ứng dụng của bạn ... nhưng không có lý do gì để tự ghi lại hiệu suất đó **. Ngược lại, nếu bạn sử dụng một hệ thống đã được kiểm tra hiện có, bạn sẽ dành thời gian sửa ứng dụng của mình và biết rằng mọi thứ đã được ghi lại chính xác. Bạn cũng sẽ có thể dễ dàng phân tích tổng hợp hơn. – Brad

+0

Vẫn còn tôi nghĩ rằng tôi không nhận được câu trả lời những gì tôi đang tìm kiếm, Cảm ơn sự giúp đỡ anyway :) –