ublock-origin-filters - Loại bỏ yếu tố gây xao nhãng bằng bộ lọc uBlock Origin

• Bộ sưu tập bộ lọc uBlock Origin cá nhân để loại bỏ các yếu tố gây xao nhãng không cần thiết trên một số trang web
• Cách hoạt động là chỉ cho phép các thao tác cụ thể trên từng trang web, đồng thời vô hiệu hóa các yếu tố còn lại có thể làm phân tán sự chú ý
• Cách dùng là thêm 0-include-all.txt vào Filter Lists > Import... của uBlock Origin để nhập bộ lọc
• Mục đích của từng bộ lọc theo đối tượng
  • Cửa sổ bật lên tài khoản Google: vô hiệu hóa các cửa sổ bật lên Google gây phiền toái xuất hiện trên nhiều trang web
  • YouTube: loại bỏ các yếu tố gây xao nhãng như video đề xuất, tự động phát, gợi ý, Shorts, đồng thời tập trung vào việc xem, tìm kiếm và tải video lên
  • Twitter: loại bỏ các yếu tố gây xao nhãng như feed, thanh bên, đồng thời tập trung vào việc xem feed tweet của hồ sơ cụ thể, xem nội dung tweet và bình luận, viết tweet
  • LinkedIn: loại bỏ các yếu tố gây xao nhãng như feed, thanh bên, đồng thời tập trung vào việc xem hồ sơ và công ty, đọc bài đăng cụ thể, trả lời tin nhắn, viết bài đăng
  • Stack Overflow và Stack Exchange: loại bỏ điểm số, ảnh đại diện, thông báo tương tác, đồng thời tập trung vào việc đọc câu trả lời hàng đầu cho câu hỏi
• Có ghi chú rằng hiện đang dùng tiện ích mở rộng Firefox Unhook cho YouTube, và có thể thay thế bằng bộ lọc

[GN⁺]

Ý kiến trên Hacker News

• Sau khi chặn nhiều quảng cáo và sidebar, việc mở rộng phần văn bản còn lại để tái sử dụng khoảng trống cũng khá hữu ích
  Ví dụ như :xpath(//main/div):style(min-width: 80% !important)
  Xa hơn nữa, tôi từng thử thêm quy tắc column-count: vào một số trang để màn hình trông như báo giấy, nhưng có nhiều thứ phải tinh chỉnh hơn tưởng tượng, và bố cục DOM của các website hiện đại gần như là một vùng ô nhiễm
  https://developer.mozilla.org/en-US/docs/Web/CSS/column-coun...
  Ví dụ tối giản về việc inject column-count: bằng uBlock ở đây: https://i.ibb.co/k3bRwhP/example-1.webp
  theguardian.com###maincontent:style(margin-left: -28vw !important; min-width: 90vw !important; column-count: 4 !important)
theguardian.com##div:style(border: none !important)

  • Đến mức này thì có khi lấy nội dung qua RSS rồi style thành dạng cột trong trình đọc sẽ tốt hơn
    Tôi thích kiểu cột, và với những thứ xem định kỳ thì đang cố quay lại mô hình lấy RSS làm trung tâm cùng nhiều bộ lọc thông minh. Cảm giác ngay từ đầu lẽ ra không nên bỏ RSS
  • Sẽ tốt nếu có thể làm cho thứ này hoạt động cả trên chế độ đọc của Firefox
  • Tôi khá thích dùng uBO và Stylus để trang trí lại nhiều website, nhưng trong nhiều trường hợp chỉ cần chuyển sang Reader Mode là nhanh hơn và tốt hơn
    Không phải lúc nào cũng làm được, nhưng khá thường xuyên là được
  • Quy tắc đầu tiên là một mẹo hay. Đôi khi xóa một phần tử nào đó sẽ làm hỏng site

• Trong uBlock Origin, vào Options > Filter Lists > Annoyances rồi bật các mục sau là được
  "AdGuard – Annoyances"
"EasyList – Annoyances"
"uBlock filters – Annoyances"
  Làm vậy có thể loại bỏ 99,9% các yếu tố gây phiền nhiễu trên website mà không phá hỏng chức năng chính. Tôi đã làm như vậy mỗi lần cài mới Chrome trong nhiều năm, và hiệu quả rất tốt

  • Internet thực ra có hai phiên bản, và bạn dùng phiên bản nào phụ thuộc vào việc trình chặn quảng cáo được cấu hình tốt đến đâu
    Trong kỳ nghỉ, khi dùng laptop của mẹ, tôi thoáng bối rối vì sao các trang mình truy cập trông khác đến vậy; gần như trang nào cũng bị quảng cáo phủ kín. Banner giữa các đoạn văn, sidebar đầy quảng cáo, thậm chí cả ảnh nền bán đồ, hoàn toàn khác với giao diện tôi quen thuộc
  • AdGuard có tốt hơn EasyList không?

• Nếu dùng uBlock Origin, tôi tò mò không biết trước khi bắt đầu dự án này bạn đã thử gửi các filter đó vào danh sách uBlock Annoyances hoặc EasyList Annoyances chưa
  Việc đó có thể giúp được nhiều người hơn rất nhiều so với tạo thêm một danh sách Annoyances mới
  https://github.com/uBlockOrigin/uAssets

  • Đây không chỉ là yếu tố gây khó chịu đơn thuần, mà gần với chức năng cốt lõi của site
  • Một số danh sách Annoyances có thể xóa quá tay cả những dấu hiệu trực quan cho biết website có RSS feed
  • Tôi không biết tới danh sách này. Đáng để thử thêm vào bộ lọc của mình và kiểm tra xem các quy tắc tôi tạo có áp dụng được ở đó không

• Cá nhân tôi, trên máy tính dùng cho công việc thì phải ẩn câu hỏi thịnh hành của Stack Exchange. Với tôi, nó gần như catnip đối với mèo vậy
  askubuntu.com###hot-network-questions
serverfault.com###hot-network-questions
stackexchange.com###hot-network-questions
stackoverflow.com###hot-network-questions
superuser.com###hot-network-questions
  Ngoài ra, nhiều trang còn phớt lờ prefers-reduced-motion, nên tôi cũng thường ẩn các yếu tố gây xao nhãng về thị giác như carousel chạy mãi không hết hay các hoạt ảnh trang trí dễ thương

  • Vào để giải một câu hỏi về vòng đời component React, rồi chẳng mấy chốc lại thấy mình bấm vào một ngoại lệ luật rắc rối nào đó của Dungeons & Dragons
  • Trong một thời gian dài tôi hoàn toàn không để ý tới cột đó. Vì não tôi đã học rằng mọi thứ ở vị trí ấy đều là đồ trang trí vô dụng
    Một ngày nọ tôi thử đọc vài câu hỏi và ngạc nhiên vì nội dung khá thú vị, rồi hoàn toàn hiểu vì sao người ta ví nó như catnip. May là có công tắc để tự tắt, nên có thể tránh bị nghiện
  • Tôi cũng tương tự, nhưng chỉ dùng bộ chọn phần tử nên hình dạng rule hơi khác
    stackoverflow.com##.c-pointer.js-quack-btn
stackoverflow.com##.js-step01.js-step.step.ws-nowrap
stackoverflow.com##.js-step02.js-step.step.has-width.ta-center
stackoverflow.com##.quack-popover--arrow
stackoverflow.com###overlay-header
stackoverflow.com###feed-link
stackoverflow.com##.mb16.s-anchors__default.s-anchors.s-sidebarwidget__yellow.s-sidebarwidget
stackoverflow.com##.grid--cell.js-reactions
stackoverflow.com##.mb16.s-anchors__grayscale.s-anchors.s-sidebarwidget__yellow.s-sidebarwidget
    Tiếc là tôi không ghi chú từng cái dùng để làm gì. Một cái có thể là banner kiểu kêu gọi bình chọn, cái khác có lẽ là hộp “Featured on Meta” và thanh bên trái mà tôi hoàn toàn không dùng. Dù không có ở trên, gần đây tôi cũng đã chặn thêm popup “New Search AI Experience” khó chịu
    May là cookie banner có bộ rule riêng, nhưng chính bộ rule đó lại gây nhiều vấn đề nhất. Nếu không tương tác với cookie banner, một số trang sẽ không hoạt động đúng hoặc thậm chí không tải. Tôi thật sự ghét Internet hiện đại khi không có uBlock
  • Những rule này rất hay. Bạn có thể đóng góp vào PR StackOverflow của kho lưu trữ: https://github.com/mig4ng/ublock-origin-filters/pull/4

• Tôi dùng cách tương tự, nhưng mục đích của tôi là bảo vệ quyền riêng tư và tránh feed thuật toán
  Bằng extension Redirector của Firefox, tôi chuyển hướng các liên kết YouTube, Twitter, StackOverflow sang các frontend thay thế tương ứng như Piped, Nitter, AnonymousOverflow. Cũng có danh sách được duy trì cho những dự án và instance kiểu này
  Phần lớn là phần mềm tự do mã nguồn mở, tôn trọng quyền riêng tư, và nhờ đặc tính là phần mềm có đạo đức nên tình cờ cũng cung cấp frontend không gây xao nhãng
  https://github.com/digitalblossom/alternative-frontends
  https://farside.link

  • Rất hay. Tôi từng đưa một ý tưởng tương tự vào bucket list: tạo các dịch vụ thay thế không gây xao nhãng rồi bằng cách nào đó redirect sang đó
    Thật vui khi biết có người cũng nghĩ như vậy và đã có các phiên bản được triển khai online

• Trước đây tôi từng tổng hợp cách xóa các đồ trang trí dụ trả tiền trên Reddit và Twitter
  reddit.com##.awarding-icon
reddit.com##.awardings-bar
reddit.com##.give-gold-button
twitter.com##:xpath(//div[contains(@style, "hex-hw-shapeclip-clipconfig")]):style(clip-path: circle(50%) !important)

  • Hiện tại Reddit đã ngừng awards, nhưng bộ lọc vẫn áp dụng cho các bài viết cũ
  • Rule cuối cùng làm gì vậy?

• Đây là rule để loại bỏ popup Login With Google lan tràn khắp Internet
  accounts.google.com/gsi/iframe
  Nó không làm hỏng chính nút đăng nhập Google, nên nếu thật sự cần thì bạn vẫn có thể đăng nhập bằng tài khoản Google

  • Tôi sẽ thử dùng một lần, nếu ổn thì có lẽ tôi cũng sẽ thêm vào. Mấy popup đó thật phiền

• Tôi đang dùng các bộ lọc uBlock Origin cho Hacker News như thế này
  news.ycombinator.com##.comment:style(max-width: 70ch !important; overflow: hidden !important;)
news.ycombinator.com##.c00:style(color: #3f3f3f !important;)
news.ycombinator.com##.comhead:style(background: #e6e6df; font-weight: italic; color: #686868 !important;)
news.ycombinator.com##.hnuser:style(background: #e6e6df; font-style: italic; color: #575757 !important;)
news.ycombinator.com##html:style(filter:invert(100%) hue-rotate(180deg); background: white)
  Giới hạn độ rộng bình luận ở mức khoảng 10 từ để dễ đọc hơn, và cũng đổi một số màu. Nếu có điểm nào cải thiện được thì cho tôi biết nhé

  • Tôi không biết là có thể thêm style vào bộ lọc uBlock
    Vì khả năng đọc và tiện debug, có lẽ tôi vẫn thích Stylus hơn, nhưng biết thêm cũng tốt
    Và font-weight: italic; có vẻ là lỗi gõ nhầm

• Tôi cũng dùng uBlock theo cách tương tự. Trong 8 năm qua tôi đã tích lũy hàng trăm bộ lọc tùy chỉnh, và gần đây nhất đã thêm các quy tắc để ẩn spoiler trên IMDb
  ! 2023-09-05 Hide episode's description and image (+ watchlist for not breaking the layout) [new experimental IMDb layout]
imdb.com##article.episode-item-wrapper .ipc-slate
imdb.com##article.episode-item-wrapper .ipc-html-content
imdb.com##article.episode-item-wrapper .ipc-watchlist-ribbon
! 2023-09-05 Hide top rated episode's description both on a TV page and an episode page
imdb.com##[data-testid="episodes-top-rated-card"] ul + div

  • Có lẽ cũng nên ẩn việc diễn viên đó xuất hiện trong bao nhiêu tập của tác phẩm. Tôi đã vài lần bị dính bởi thông tin đó
  • Tôi tò mò là bạn có công khai các bộ lọc khác không. Có thể chia sẻ không?

• Arc có một tính năng cơ bản để cải thiện phần tùy biến giao diện. Họ gọi là Boosts, bạn có thể tự tạo chỉ với vài cú nhấp, và nếu cần thì cũng có thể thêm CSS/JS tùy chỉnh
  Tôi dùng nó rất nhiều để loại bỏ các yếu tố gây xao nhãng trên hầu hết các trang như Facebook, Twitter, Reddit, Medium, Gmail, YouTube, v.v., và thực sự nó thay đổi cuộc sống đến mức đó
  Có thể xem các Boosts do người dùng khác chia sẻ tại đây: https://arc.net/boosts

  • Tôi thật sự thích tab dọc của Arc. Trước đây tôi từng dùng tab dọc có tab lồng nhau trên Firefox và luồng làm việc rất ổn
    Khả năng nhốt cái hố thỏ tab xuất hiện khi đào sâu vào một chủ đề trong một nhóm là rất tuyệt. Khi xong, có thể đóng nhóm để chỉ còn lại các tab ban đầu muốn giữ, và tôi nhớ điều đó
    Hiện giờ tôi không dùng vì mất thời gian để thiết lập, và không có cách dễ dàng để quản lý nó theo kiểu khai báo như code nhằm chia sẻ giữa các thiết bị và lưu trữ lâu dài. Nếu tìm được cách thì có thể tôi sẽ dùng lại
    Tôi đã thử Arc nhưng có vài điểm không thích. Nó không phải mã nguồn mở và Boosts có vẻ cũng vậy. Vì dựa trên Chromium, nó không phù hợp với lập trường của tôi là muốn Firefox hay các trình duyệt khác giữ được thị phần. Không phải tôi ghét Google, nhưng tôi không muốn một công ty thống trị web. Và có vẻ nó chỉ chạy trên macOS, iOS, dù tôi không biết giờ còn như vậy không
  • Arc có UI trình duyệt tốt nhất trong số những gì đã xuất hiện cho đến nay. Phần còn lại về bản chất vẫn đang mắc kẹt ở cuối thập niên 2000