Mặc dù không có nhiều thay đổi lớn về các tính năng ngôn ngữ như các phiên bản trước, nhưng trong phiên bản này, trọng tâm chính là hiệu suất và trải nghiệm phát triển. Dưới đây là một số điểm nổi bật của phiên bản này:

YJIT

YJIT, trình biên dịch JIT của Ruby, đã có những cải tiến đáng kể trong vài năm qua. Trong năm nay, nó tiếp tục trở nên nhanh hơn, đồng thời tiêu thụ ít bộ nhớ hơn.

Các công ty như Basecamp và Shopify đã sử dụng phiên bản xem trước của 3.3 trong môi trường production và đã thấy sự cải thiện khoảng 15% trong thời gian phản hồi trung bình so với phiên bản 3.3.0 không có YJIT.
Thực tế, YJIT đã rất hiệu quả trong việc tăng tốc ứng dụng Rails và nó sẽ được kích hoạt mặc định trên ứng dụng Rails mới nếu sử dụng Ruby 3.3.

Một phương thức mới, RubyVM::YJIT.enable đã được giới thiệu, cho phép bạn kích hoạt YJIT khi đang chạy. Điều này có thể hữu ích nếu bạn muốn tải ứng dụng nhanh chóng và sau đó kích hoạt YJIT sau khi nó đã khởi động. Đây chính là cách Rails sử dụng để kích hoạt JIT trong một bộ khởi tạo.

RJIT

Một trình biên dịch JIT thử nghiệm có tên là RJIT đã được giới thiệu. Được viết bằng Ruby thuần, nó thay thế MJIT, một JIT thay thế khác đã có sẵn trong Ruby 3.2. RJIT sử dụng nhiều bộ nhớ hơn so với YJIT và chỉ tồn tại cho mục đích thử nghiệm. Trong môi trường sản xuất, vẫn nên sử dụng YJIT.

IRB

Từ khi biết đến Ruby, pry là công cụ gỡ lỗi ưa thích của mình, mình đã chuyển sang sử dụng IRB gần đây, sau khi biết tới bài viết này. Trong phiên bản này, IRB và integration của nó với gem debug đã được cải thiện đến mức pry và byebug không còn cần thiết cho việc gỡ lỗi mã nguồn của bạn.

Range

Rails Range#overlaps?(range)

So sánh hai phạm vi và xem liệu chúng có trùng lặp với nhau không. overlap? trả về true nếu hai phạm vi trùng nhau nếu không thì trả về false.

(3..8).overlaps?(8..10) # => true
(2..43).overlaps?(3..5) # => true
(1..5).overlaps?(7..9) # => false

('a'..'z').overlaps?('c'..'d') # => true

(1.day.from_now..5.days.from_now).overlaps?(5.days.from_now..10.days.from_now) # => false
(1.day.from_now.to_date..5.days.from_now.to_date).overlaps?(5.days.from_now.to_date..10.days.from_now.to_date) # => true

(3...8).overlaps?(8...9) # => false
(3...8).overlaps?(7...9) # => true

# works similarly for open ranges.
(3..).overlaps?(...3) # => false

Ruby < 3.3

Không giống như Rails, Ruby không có phương thức nào để so sánh hai phạm vi và kiểm tra chúng có trùng nhau hay không.

Trước Ruby 3.3, nếu chúng ta muốn kiểm tra sự trùng lặp, chúng ta cần sử dụng phương thức cover, nó sẽ trả về true nếu hai phạm vi trùng nhau.

# Check if range1 covers any value in range2 or vice versa
range1 = (3..8)
range2 = (8..10)
range1.cover?(range2.first) || range2.cover?(range1.first) # => true

range1 = ('a'..'z')
range2 = ('c'..'d')
range1.cover?(range2.first) || range2.cover?(range1.first) # => true

range1 = (1.day.from_now..5.days.from_now)
range2 = (5.days.from_now..10.days.from_now)
range1.cover?(range2.first) || range2.cover?(range1.first) # => false

range1 = (1.day.from_now.to_date..5.days.from_now.to_date)
range2 = (5.days.from_now.to_date..10.days.from_now.to_date)
range1.cover?(range2.first) || range2.cover?(range1.first) # => true

Ruby 3.3

Ruby 3.3 giới thiệu phương thức Range#overlap?(range). Giống như Rails, chúng ta có thể sử dụng overlap? để so sánh hai phạm vi và xem chúng có trùng lặp với nhau không.

• Nó trả về true nếu hai phạm vi trùng nhau nếu không thì trả về sai.
• Nó sẽ raise TypeError nếu argument không phải kiểu range

range1 = (3..8)
range2 = (8..10)
range1.overlap?(range2) # => true

range1 = ('a'..'z')
range2 = ('c'..'d')
range1.overlap?(range2) # => true

range1 = (1.day.from_now..5.days.from_now)
range2 = (5.days.from_now..10.days.from_now)
range1.overlap?(range2) # => false

range1 = (1.day.from_now.to_date..5.days.from_now.to_date)
range2 = (5.days.from_now.to_date..10.days.from_now.to_date)
range1.overlap?(range2) # => true

(3..).overlap?(...3) # => false

(3..8).overlap?(3) # => TypeError, argument must be Range

Tham khảo

https://www.ruby-lang.org/en/news/2023/12/11/ruby-3-3-0-rc1-released/
https://railsatscale.com/2023-09-18-ruby-3-3-s-yjit-runs-shopify-s-production-code-15-faster/
https://railsatscale.com/2023-12-04-ruby-3-3-s-yjit-faster-while-using-less-memory/

The post What’s new in Ruby 3.3.0 appeared first on Tomoshare.

I. Tại sao chúng ta cần :where() và :is()?

Trước khi có những pseudo-classes này, để áp dụng kiểu cho nhiều selector, chúng ta thường phải sử dụng một danh sách dài các selector, đôi khi dẫn đến mã CSS dài và khó đọc. Cùng xem xét một ví dụ:

h1, h2, h3, h4, h5, h6 {
  color: blue;
}

Trong trường hợp này, chúng ta muốn áp dụng màu xanh cho tất cả các phần tử tiêu đề từ h1 đến h6. Tuy nhiên, khi cần loại bỏ một số phần tử khỏi danh sách, chúng ta phải lặp lại toàn bộ danh sách và loại bỏ chúng:

h1, h2, h3, h5, h6 {
  color: blue;
}

Với :where() và :is(), chúng ta có cách tiếp cận mới giúp giảm sự lặp lại và làm cho mã CSS trở nên sáng sủa hơn.

II. Sử Dụng :where() và :is()

1. Sử dụng :where()

Cú pháp của :where() rất đơn giản. Nó cho phép bạn nhóm các selector lại một cách hiệu quả mà không cần phải lặp lại toàn bộ danh sách:

:where(h1, h2, h3, h4, h5, h6) {
  color: blue;
}

Câu lệnh trên sẽ có kết quả giống như ví dụ đầu tiên, áp dụng màu xanh cho tất cả các phần tử tiêu đề từ h1 đến h6

2. Sử dụng :is()

Tương tự như :where(), :is() cung cấp một cách khác để nhóm các selector:

:is(h1, h2, h3, h4, h5, h6) {
  color: blue;
}

Cả hai cách tiếp cận đều tạo ra kết quả tương tự và giúp bạn làm cho mã CSS ngắn gọn hơn và dễ đọc hơn.

III. Ưu điểm và Lưu ý

1. Ngắn Gọn và Dễ Đọc:

Cả :where() và :is() giúp giảm sự lặp lại trong mã CSS, làm cho nó trở nên ngắn gọn và dễ đọc hơn.

2. Tích hợp Dễ Dàng:

Cả hai pseudo-classes này tích hợp tốt với các selector khác, giúp bạn duy trì tính tương thích và tính linh hoạt trong mã nguồn của mình.

3. Dễ Bảo Trì:

Khi cần thêm hoặc loại bỏ các selector, bạn chỉ cần thực hiện thay đổi ở một địa điểm duy nhất, giúp dễ bảo trì hơn.

4. Trình duyệt hỗ trợ:

:where()

:is()

IV. Kết Luận

Sử dụng :where() và :is() trong CSS selector mang lại những lợi ích đáng kể về sự ngắn gọn và dễ đọc. Đặc biệt, chúng là một công cụ hữu ích khi bạn cần áp dụng kiểu cho nhiều phần tử cùng loại một cách linh hoạt. Hãy tích hợp chúng vào công cụ lập trình CSS của bạn để trải nghiệm sự tiện lợi mà chúng mang lại.

The post Sử dụng :where() và :is() trong CSS Selector – Ngắn gọn và mạnh mẽ appeared first on Tomoshare.

I. Giới Thiệu về :has()

:has() là một pseudo-class mới trong CSS, cho phép bạn chọn các phần tử cha dựa trên nội dung của các phần tử con bên trong chúng. Cú pháp cơ bản như sau:

parent:has(child) {
  /* CSS styles */ 
}

Với :has(), bạn có thể áp dụng kiểu cho các phần tử cha chứa một hoặc nhiều phần tử con cụ thể, làm cho việc chọn lựa và định dạng trang web trở nên linh hoạt hơn.

II. Sử Dụng Cú Pháp :has()

1. Chọn Parent Có Phần Tử Con Cụ Thể

div:has(p) {
  background-color: #f0f0f0;
}

Trong trường hợp này, tất cả các div chứa ít nhất một phần tử p sẽ có nền màu xám nhạt.

2. Kết Hợp Nhiều Phần Tử Con

article:has(h2, p) {
  border: 1px solid #ccc;
}

Câu lệnh trên sẽ chọn tất cả các phần tử article chứa ít nhất một phần tử h2 hoặc p và áp dụng đường viền xám nhạt.

3. Sử Dụng Nested :has()

section:has(article:has(h2)) {
  margin: 10px;
}

Trong trường hợp này, section sẽ được chọn nếu nó chứa ít nhất một article có chứa ít nhất một phần tử h2.

III. Ưu Điểm và Hạn Chế

1. Ưu Điểm của :has()

• Linh Hoạt: Cho phép bạn chọn các phần tử cha dựa trên nội dung của phần tử con, mang lại sự linh hoạt cao khi định dạng trang web.
• Dễ Đọc: Làm cho mã CSS trở nên rõ ràng hơn, giảm sự phức tạp của selector.

2. Hạn Chế và Lưu ý

• Hạn Chế Sự Linh Hoạt: Mặc dù mạnh mẽ, nhưng :has() có thể hạn chế sự linh hoạt khi so sánh với một số phương pháp khác như JavaScript.
• Hỗ Trợ Trình Duyệt: Hiện tại, :has() chưa được hỗ trợ rộng rãi, vì vậy hãy kiểm tra hỗ trợ trình duyệt trước khi sử dụng.

3. Trình duyệt hỗ trợ

IV. Kết Luận

Pseudo-class :has() mang lại một cách tiếp cận mới và thú vị cho việc chọn các phần tử cha dựa trên nội dung của phần tử con trong CSS. Tuy nhiên, đối với sự hỗ trợ và linh hoạt, cân nhắc kết hợp :has() với các phương pháp khác để đảm bảo tính ổn định và tương thích trình duyệt. Hãy thử nghiệm và tận dụng sức mạnh của :has() để tối ưu hóa mã CSS của bạn.

The post Khám Phá CSS Parent Selector :has() appeared first on Tomoshare.

Đặt vấn đề

Trong quá trình phát triển web, không tránh khỏi việc ứng dụng của chúng ta xảy lỗi hệ thống.Mỗi lỗi hệ thống, crash, hoặc sự cố có thể gây ra tác động nghiêm trọng đến trải nghiệm người dùng và ảnh hưởng đến hiệu suất của ứng dụng. Sentry là một lựa chọn có thể giúp chúng ta kiểm soát tình hình và quản lý các lỗi hệ thống này một cách hiệu quả.

Giới thiệu Sentry

Sentry là một dịch vụ giám sát lỗi và hiểu lỗi phát triển dành cho các ứng dụng web và di động. Sentry giúp các nhà phát triển theo dõi và kiểm soát lỗi trong ứng dụng của họ để cải thiện chất lượng và hiệu suất của ứng dụng. Dưới đây là một số điểm quan trọng về Sentry:

1. Giám sát Lỗi (Error Monitoring): Sentry thu thập thông tin về lỗi và sự cố trong ứng dụng và hiển thị chúng trong một giao diện quản trị để giúp bạn dễ dàng theo dõi và quản lý lỗi.
2. Ghi Log (Logging): Ngoài việc giám sát lỗi, Sentry cũng hỗ trợ ghi log để giúp bạn theo dõi và hiểu hơn về hoạt động của ứng dụng.
3. Integrations: Sentry có khả năng tích hợp với nhiều ngôn ngữ lập trình và framework phổ biến như JavaScript, Python, Ruby, PHP, Java, và nhiều ứng dụng web framework khác.
4. Tích hợp CICD: Sentry có thể tích hợp vào quy trình Continuous Integration và Continuous Deployment (CI/CD) để đảm bảo rằng lỗi không xuất hiện trong các phiên bản mới của ứng dụng.
5. Thời gian thực (Real-Time): Sentry cung cấp thông tin về lỗi và sự cố trong thời gian thực, giúp bạn nhanh chóng phát hiện và giải quyết các vấn đề liên quan đến hiệu suất của ứng dụng.
6. Cấu hình tùy chỉnh (Customization): Bạn có thể tùy chỉnh Sentry để phản ánh cơ cấu tổ chức và yêu cầu riêng của ứng dụng của bạn.

Sentry là một công cụ quan trọng trong việc quản lý và cải thiện chất lượng của ứng dụng, giúp đảm bảo rằng lỗi được xử lý một cách hiệu quả và không ảnh hưởng đến trải nghiệm người dùng.

Config Sentry cho Rails app

Đăng ký / Đăng nhập tại đây

Sau khi đăng nhập hãy tạo 1 project

Có thể thấy Sentry hỗ trợ rất nhiều ngôn ngữ và framework. Có một option Ruby nhưng option Rails sẽ hỗ trợ nhiều hơn và dễ sử dụng.

Sau khi tạo 1 sự án, Sentry sẽ cho chúng ta 1 hướng dẫn tích hợp Sentry vào Rails app như trên

Tiếp theo, setup cho source rails:

Add gem sentry-ruby và sentry-rails

Đừng quên chạy bundle install nhé 🤣🤣

#Gemfile
gem "sentry-ruby"
gem "sentry-rails"

Khởi tạo SDK với một số cấu hình cơ bản phục vụ cho việc tracking lỗi:

#config/initializers/sentry.rb
Sentry.init do |config|
  config.dsn = 'https://4506035982696448.ingest.sentry.io/....'
  config.send_default_pii = true
  config.include_local_variables = true
  config.breadcrumbs_logger = [:sentry_logger, :active_support_logger, :http_logger]

  filter = ActiveSupport::ParameterFilter.new(Rails.application.config.filter_parameters)
  config.before_send = lambda do |event, hint|
    filter.filter(event.to_hash)
  end

  config.traces_sample_rate = 0.1
end

Ở trong phần configure này, các cấu hình có ý nghĩa sau:

Sau khi configure, hãy kiểm tra xem Sentry đã được tính hợp đúng trong ứng dụng của chúng ta chưa nhé!

Có thể tạo 1 Exception hoặc sử dụng rails console và chạy lệnh sau:

Sentry.capture_message("test message")

Kết quả Sentry trả về cho chúng ta một event tracking lỗi chứa một số thông tin như: thời gian, tên OS, môi trường, server name, message, vv…
như vậy có nghĩa là chúng ta đã tích hợp thành công Sentry vào Rails app

Các thông tin này sẽ được gửi lên server của Sentry và chúng ta có thể xem nó trên giao diện dasborad

Summary

Tóm tắt lại, trong bài viết này, chúng ta đã tìm hiểu về Sentry, một công cụ quan trọng trong quá trình phát triển ứng dụng Rails. Sentry không chỉ giúp theo dõi và ghi lại lỗi, mà còn cung cấp nhiều tính năng hữu ích khác để cải thiện chất lượng phần mềm.

Chúng ta đã xem xét cách tích hợp Sentry vào ứng dụng Rails, cấu hình gem, tùy chỉnh các cài đặt như gửi thông tin cá nhân, breadcrumbs, và lọc thông tin trước khi gửi đến Sentry.

Không chỉ với Ruby hay Rails, Sentry còn hỗ trợ hơn 85 Platforms khác nhau.
Tôi nghĩ trong vòng đời ứng dụng, việc tích hợp Sentry là càng sớm càng tốt

Tài liệu
https://docs.sentry.io/platforms/ruby/guides/rails/

The post Sentry for Rails appeared first on Tomoshare.