6

Làm việc với mã kế thừa có thể rất cồng kềnh đối với ngay cả nhà phát triển web dày dạn nhất.

Từ cú pháp căng mắt đến các vấn đề về hiệu suất trên phạm vi toàn cầu, mã không chính đáng có thể là một trong những điểm đau lớn nhất bạn có thể gặp phải khi làm việc trên trang web của khách hàng mới. May mắn thay, tái cấu trúc cung cấp một tùy chọn để thoát khỏi vực thẳm của mã lộn xộn.

Nếu bạn chưa từng làm điều đó trước đây, tái cấu trúc là quá trình tái cấu trúc cơ sở mã hiện có theo cách nó không làm thay đổi hành vi bên ngoài của mã, nhưng vẫn cải thiện cấu trúc bên trong của nó.

Vài tuần trước, chúng tôi đã ngồi lại với Harry Roberts của CSS Wizardry  cho một hội thảo trực tuyến về Đối tác Shopify , nơi chúng tôi trò chuyện về tầm quan trọng và những thách thức của việc tái cấu trúc CSS kế thừa. Harry dẫn chúng tôi đi qua quy trình của mình và đưa ra một số lời khuyên có giá trị cho các nhà phát triển mới bắt đầu với việc tái cấu trúc. Bạn có thể xem bản ghi webinar đầy đủ tại đây:


Trong cuộc nói chuyện của mình, Harry cũng chia sẻ nhiều mẹo cần ghi nhớ khi tiếp cận một dự án tái cấu trúc. Chúng tôi đã biên soạn một số trong số chúng ở đây để cung cấp cho bạn lời khuyên cần thiết để bắt đầu tái cấu trúc CSS mà không mất trí.

1. Hiểu khi đến lúc tái cấu trúc

Mặc dù điều quan trọng là phải hiểu cách tái cấu trúc một cơ sở mã, nhưng điều quan trọng không kém là phải hiểu khi nào thì phù hợp để làm như vậy. Tái cấu trúc có thể là một quá trình rất nặng về nhân lực, có thể cần vô số giờ để sàng lọc mọi tính năng của trang web, ứng dụng hoặc trang web của khách hàng của bạn.

Mặc dù Harry khẳng định chắc chắn rằng, bằng cách này hay cách khác, chúng ta nên luôn luôn cấu trúc lại mã của mình trên cơ sở đang diễn ra, nhưng ông cũng thừa nhận rằng có một vài trường hợp luôn cần phải tái cấu trúc. Thử nghiệm giấy quỳ của anh ta để xác định các loại tình huống này dựa trên ba biến sau:

  • Nếu chi phí bảo trì dự kiến ​​cao hơn viết lại  - Mục đích của tái cấu trúc là loại bỏ mã không cần thiết để tăng hiệu suất và giảm chi phí. Nếu quy trình đề xuất của bạn cung cấp một giải pháp thay thế rẻ hơn để duy trì cơ sở mã hiện tại, thì có lợi cho bạn để tái cấu trúc ngay bây giờ trước khi các chi phí bảo trì đó còn lớn hơn.
  • Nếu phiên bản hiện tại của tính năng của bạn đang cản trở hiệu suất -  Nếu phiên bản hiện tại đang làm chậm trang web của bạn, thì đó là một dấu hiệu rõ ràng rằng đã đến lúc bạn xem xét cơ sở hạ tầng mã hiện tại của mình.
  • Nếu phiên bản mới của tính năng hoặc mã được tái cấu trúc của bạn cung cấp lợi ích hữu hình -  Điều này ngược lại với dòng đã nói ở trên, nhưng dù sao cũng rất quan trọng để xem xét. Ngay cả khi phiên bản hiện tại của bạn không quá rắc rối, vẫn có thể có một số lợi ích tiềm năng phát sinh từ việc thu dọn CSS. Dành thời gian để xem xét và xem nếu có bất cứ điều gì đã trượt qua các vết nứt.

2. Hiểu khi chưa đến lúc tái cấu trúc

Có nhiều trường hợp khi tái cấu trúc không phải là giải pháp phù hợp để bạn theo đuổi. Do chi phí cao và nỗ lực liên quan đến tái cấu trúc, điều đặc biệt quan trọng là phải hiểu khi nào nó thực sự có thể là lựa chọn tốn kém hơn .

Dưới đây, là một số lời khuyên của Harry để quyết định xem bạn có cần cấu trúc lại hay không.

  • Nếu bạn không thực sự bị làm chậm bởi một cái gì đó -  Nếu một cái gì đó không gây ra vấn đề cho trang web, ứng dụng hoặc doanh nghiệp của khách hàng của bạn, thì có lẽ không đáng để tái cấu trúc.
  • Nếu đó là thứ có thể được ghi lại bằng cách viết lại sau này -  Nếu khách hàng của bạn biết rằng trong một vài tháng tới họ sẽ viết lại toàn bộ trang web của họ, thì thực sự không đáng để cấu trúc lại cơ sở mã tại thời điểm này, nếu công việc sẽ bị xóa xuống dòng.
  • Nếu viết lại là một giải pháp tốt hơn so với tái cấu trúc -  Có một số dự án mà cơ sở mã rất đau đớn đến nỗi viết lại toàn bộ CSS từ đầu thực sự là tùy chọn thông minh hơn so với tái cấu trúc mã hiện có.

3. Hiểu lợi ích của tái cấu trúc

Một số khách hàng có thể do dự về việc thuê bạn tái cấu trúc CSS trang web của họ do thiếu hiểu biết về việc tái cấu trúc thực sự đạt được gì. Điều này có thể đặc biệt đúng đối với những khách hàng ít hiểu biết về công nghệ, những người có thể xem tái cấu trúc chỉ đơn giản là dọn phòng cho trang web hiện tại của họ. Điều quan trọng trong những tình huống này là bạn có thể truyền đạt rõ ràng các lợi ích tái cấu trúc có thể có trên trang web hoặc ứng dụng web của họ.

Nếu bạn thấy mình phải đối mặt với một khách hàng hoài nghi, hãy đảm bảo truyền đạt các tác động tích cực tái cấu trúc có thể có cho doanh nghiệp của họ. Một vài ví dụ bạn có thể chia sẻ bao gồm:

  • Tăng khả năng đọc và dễ sử dụng cho các nhà phát triển -  Theo bản chất của quy trình tái cấu trúc, bạn sẽ giảm được độ phức tạp của hệ thống CSS. Điều này, đến lượt nó, sẽ giúp các nhà phát triển khác dễ dàng truy cập, đọc và cập nhật mã của bạn hơn. Điều này có thể đặc biệt quan trọng đối với các công ty trên các nhà phát triển mới hoặc làm việc trong các nhóm phát triển lớn hơn.
  • Ít lỗi hơn, nâng cao hiệu suất và trải nghiệm người dùng tốt hơn -  Những lợi ích về hiệu suất từ ​​tái cấu trúc đã được biết đến. Bằng cách thu dọn mã của bạn, ứng dụng web hoặc trang web của bạn sẽ thấy các cải tiến gần như ngay lập tức, điều này sẽ mang lại trải nghiệm tốt hơn cho người dùng cuối của bạn.
  • Giúp xóa nợ kỹ thuật và tiết kiệm tiền -  Cấu trúc mã kém đòi hỏi phải bảo trì liên tục và thường có nghĩa là các nhà phát triển đang dành nhiều thời gian làm việc trong mã hơn so với thực tế. Bằng cách tái cấu trúc, bạn sẽ giảm nợ kỹ thuật trong nội bộ, có thể chuyển thành tiết kiệm tài chính - điều mà mọi khách hàng đều muốn nghe.

Bắt đầu tái cấu trúc CSS mà không mất trí

Nếu bạn đang muốn tìm hiểu thêm về quy trình tái cấu trúc, hãy đảm bảo xem  bản ghi âm hội thảo trên web của Harry .

|