Điểm mới trong Chrome 60

  • Paint Timing API cho phép bạn đo lường thời gian để vẽ lần đầu và thời gian để vẽ nội dung lần đầu bằng Paint Timings AP.
  • font-display cho phép bạn kiểm soát cách hiển thị phông chữ trước khi tải xuống.
  • WebAssembly đã ra mắt
  • Và còn nhiều tính năng khác!

Bạn muốn xem danh sách đầy đủ các thay đổi? Xem danh sách thay đổi về kho lưu trữ nguồn Chromium

Tôi là Pete LePage. Hãy cùng tìm hiểu những tính năng mới dành cho nhà phát triển trong Chrome 60!

API thời gian vẽ

Khi người dùng chuyển đến một trang web, họ sẽ tìm kiếm một số phản hồi trực quan để đảm bảo rằng mọi thứ đều đang hoạt động. Với API thời gian vẽ mới, chúng ta hiện có thể đo lường điều đó.

API này hiển thị hai chỉ số:

  • Thời gian vẽ lần đầu – đánh dấu thời điểm trình duyệt bắt đầu kết xuất nội dung, tức là bit nội dung đầu tiên trên màn hình.
  • Thời gian hiển thị nội dung đầu tiên – đánh dấu thời điểm trình duyệt hiển thị nội dung đầu tiên từ DOM, văn bản, hình ảnh, v.v.

Hãy xem bài viết Tận dụng các chỉ số hiệu suất ảnh hưởng nhiều nhất đến trải nghiệm người dùng để tìm hiểu cách theo dõi và sử dụng các chỉ số này nhằm cải thiện trải nghiệm.

Thuộc tính font-display của CSS

Phông chữ web cho phép bạn kết hợp kiểu chữ đa dạng. Tuy nhiên, nếu người dùng chưa có phông chữ, thì họ cần tải phông chữ xuống, điều này có thể khiến trang web của bạn bị chậm.

Rất may, hầu hết các trình duyệt sẽ sử dụng phương án dự phòng nếu quá trình tải phông chữ xuống mất quá nhiều thời gian. Thuộc tính font-display mới cho phép bạn kiểm soát cách một phông chữ có thể tải xuống hiển thị trước khi tải đầy đủ.

  • auto sử dụng bất kỳ chiến lược hiển thị phông chữ nào mà tác nhân người dùng sử dụng.
  • block cung cấp cho phông chữ một khoảng thời gian chặn ngắn và một khoảng thời gian hoán đổi vô hạn.
  • swap cung cấp cho mặt phông chữ một khoảng thời gian khối bằng 0 giây và một khoảng thời gian hoán đổi vô hạn.
  • fallback cung cấp cho phông chữ một khoảng thời gian khối cực nhỏ và một khoảng thời gian hoán đổi ngắn.
  • optional cung cấp cho phông chữ một khoảng thời gian chặn cực nhỏ và khoảng thời gian hoán đổi bằng 0 giây.

Tính năng này được hỗ trợ trong Chrome 60 và Opera, đồng thời đang được phát triển trên Firefox. Hãy xem bài viết Kiểm soát hiệu suất phông chữ bằng font-display để biết thêm thông tin.

WebAssembly

Web Assembly (hoặc wasm) cung cấp một cách mới để chạy mã được viết bằng các ngôn ngữ như C và C++ trên web, ở tốc độ gần như gốc.

API này cung cấp tốc độ cần thiết để tạo trình chỉnh sửa video trong trình duyệt hoặc để chạy trò chơi Unity ở tốc độ khung hình cao bằng cách sử dụng các API nền tảng web dựa trên tiêu chuẩn hiện có.

Bạn có thể tìm thêm thông tin tại webassembly.org, bao gồm cả bản minh hoạ, tài liệu và cách bắt đầu.

Và nhiều tính năng khác!

  • Web Budget API mới cho phép các trang web có quyền Thông báo đẩy gửi một số lượng hạn chế thông báo đẩy kích hoạt công việc ở chế độ nền, chẳng hạn như đồng bộ hoá dữ liệu hoặc đóng thông báo mà không cần hiển thị thông báo mà người dùng nhìn thấy.
  • PushSubscription.expirationTime hiện đã có, thông báo cho các trang web về thời điểm và liệu gói thuê bao có hết hạn hay không.
  • Các thuộc tính Object rest & spread (Đối tượng nghỉ ngơi và lan truyền) hiện được hỗ trợ, giúp bạn dễ dàng hợp nhất và sao chép nông các đối tượng cũng như triển khai nhiều mẫu đối tượng không thể thay đổi.

Lưu ý: Payment Request API đã được đẩy lên Chrome 61.

Đây chỉ là một số thay đổi dành cho nhà phát triển trong Chrome 60.

Sau đó, hãy đăng ký kênh YouTube của chúng tôi để nhận thông báo qua email mỗi khi chúng tôi ra mắt video mới.

Tôi là Pete LePage. Ngay khi Chrome 61 được phát hành, tôi sẽ quay lại đây để cho bạn biết những tính năng mới trong Chrome!