Sự khác biệt giữa Ext.get() và document.getElementById() về mặt hiệu suất là gì? Liệu Ext.get() có chậm hơn vì nó có thể gọi nội bộ document.getElementById() không? Hoặc có lợi thế cụ thể nào khi sử dụng Ext.get() không?Điều nào tốt hơn - Ext.get() hoặc document.getElementById()
Lợi thế nguyên tắc của Ext.get trên getElementById là nó trả về cho bạn một cá thể Ext.Element.Ví dụ này không chỉ chứa tham chiếu nút DOM mà getElementById sẽ cung cấp cho bạn mà còn mở rộng đáng kể nó - cung cấp một bộ các phương thức tiện lợi, bình thường hóa sự kiện và một sự khác biệt giữa các trình duyệt chéo.
Trên bề mặt getElementById có thể có một số tăng tốc độ nhỏ hơn Ext.get chỉ đơn giản là trên cơ sở của một chức năng ít hơn trước khi nhận được cùng một cuộc gọi DOM cơ bản. Tuy nhiên, về hiệu suất tổng thể, những gì bạn làm với phần tử sau khi truy xuất sẽ có khả năng có tác động nhiều hơn bản thân việc truy xuất. Có wrapper Ext.Element trên tay có thể chứng minh là khá có lợi.
Bạn cũng có thể xem Ext.fly. Phương thức này tương tự như Ext.get với ngoại lệ là nó trả về cho bạn một cá thể singleton Ext.Element. Sẽ không tốt nếu bạn cần lưu trữ phần tử để sử dụng sau này, nhưng nếu bạn đang thực hiện các thao tác đơn giản, một lần đối với các nút DOM duy nhất, nó có thể rẻ hơn Ext.get.
document.getElementById() có nguồn gốc JavaScript và như vậy sẽ nhanh hơn Ext.get()
Bây giờ tại sao Ext.get() luôn luôn ở đó,
document.getElementById() trả về một phần tử DOM, trong khi Ext.get() trả về một đối tượng Ext đó là apt cho chaining mục đích.
Và đây cũng là lý do tại sao jQuery có một $("#elm_id"). Xin lưu ý rằng Ext.get() cũng dễ nhập hơn :)
Ext.get() cho phép sử dụng ID chuỗi, HTMLElement hiện tại hoặc Ext.Element - vì vậy nó linh hoạt hơn một chút. document.getElementById() chỉ chấp nhận ID chuỗi.
Điều đó nói rằng, tôi chỉ sử dụng document.getElementById() nếu nó đáp ứng nhu cầu của bạn. Nó có nguồn gốc từ trình duyệt và sẽ nhanh hơn một chút - và đó là một cuộc gọi ít hơn mà bạn đang tự tạo cho mình một khung JavaScript cụ thể.
Tôi không quen với thư viện Ext, nhưng với vani Javascript, chỉ có một số cách để có được một yếu tố cụ thể; bạn có thể lấy nó bằng ID của nó, tìm kiếm nó sau khi lấy tất cả các phần tử bằng tên thẻ (đây là cách JQuery lấy các phần tử theo tên lớp mà tôi tin), hoặc mới thành HTML5, lấy một phần tử theo tên lớp. Có một vài cách khác nếu bạn sáng tạo;) Chỉ nhận được bằng ID là nhanh nhất, giả sử bạn không lưu một tham chiếu cục bộ. Vì vậy, nếu tất cả những gì bạn đang cố gắng làm là lấy một phần tử mà không làm bất cứ điều gì Ext.js thực hiện thông qua lời gọi hàm đó, thì vanilla Javascript sẽ nhanh hơn rất nhiều.
Về hiệu suất, các hàm JS gốc sẽ luôn nhanh hơn.
Tuy nhiên, tôi không nói không sử dụng JS Thư viện, họ là tuyệt vời như họ:
Và cuối cùng, có thể bạn tiết kiệm thời gian vì ít mã hơn có nghĩa là tải xuống nhanh hơn và trong một số trường hợp thậm chí có thể đánh bại hiệu suất.
Vì vậy, vâng, cũng giống như sử dụng cái kia, vì một mặt bạn tiết kiệm thời gian theo hiệu suất ("document.getElementById()") và ngược lại bạn giảm kích thước tệp và thời gian tải xuống ("Ext .được()").
Bạn có thể sử dụng cả hai và không nên có bất kỳ sự khác biệt đáng chú ý nào.
Khi những người khác đã đến đây, phương pháp được sử dụng tùy theo nhu cầu, nếu bạn chỉ muốn tham chiếu đến phần tử dom cho một số mục đích không phải là Ext, bạn cũng có thể sử dụng hàm gốc, nhưng nếu bạn định thực hiện hành động trên đối tượng trả về trong ngữ cảnh Ext, sau đó Ext.get sẽ trả về cho bạn một tham chiếu Element, cung cấp các phương thức bổ sung.
Ext.get là viết tắt của Ext.ComponentManager.get và trong khi đó là lời gọi hàm thư viện và có thể kém hiệu quả hơn cần lưu ý rằng có ~ 180 phương thức có sẵn trên Ext.Element, vì vậy nếu bạn cần đây có thể là giá trị bao gồm cả cuộc gọi bao bọc.
Như cú đã đề cập, Ext.fly() được thiết kế khi bạn cần thực hiện một hàm duy nhất trên một phần tử, ví dụ: Ext.fly("myDiv").hide(); trong khi Ext.get() được thiết kế khi bạn cần một tham chiếu đến một phần tử để sử dụng sau này, ví dụ: var something = Ext.get("myDiv"); thì có lẽ something.sort(); something.badger(); return something;
'document.getElementById() == Ext.get(). Dom' – Jaider