Làm cách nào để giảm thiểu mã php?

Việc thu nhỏ tệp có thể tạo ra sự khác biệt về hiệu suất trong thế giới thực trong dự án của bạn, không phải về hiệu suất mã của bạn trong trình duyệt, mà là tốc độ mà người dùng nhận được mã và tải của máy chủ khi tệp cần được phục vụ cho nhiều

Dù bạn có ý định gì với việc triển khai công cụ khai thác trong máy chủ của mình, như mọi khi, chúng tôi khuyên bạn không nên phát minh lại bánh xe (không xây dựng công cụ khai thác của riêng bạn bằng PHP) và sử dụng thư viện. Nếu bạn muốn biết thêm lý do tại sao bạn nên sử dụng thư viện, chúng tôi khuyên bạn nên đọc bài viết tuyệt vời này

Trong bài viết này, bạn sẽ tìm hiểu cách thu nhỏ mã CSS và JS của mình bằng 3 thư viện khác nhau

1. Nén Javascript và CSS với Minify

Nếu bạn đang tìm kiếm một lớp rút gọn cả Javascript và CSS, thì bạn có thể sử dụng gói Minify được viết bởi MatthiasMullie. Gói Minify có thể được sử dụng với Trình soạn thảo và với các Lớp PHP đơn giản

Cài đặt với nhà soạn nhạc

Thêm gói Minify làm phụ thuộc vào dự án của bạn bằng lệnh sau

composer require matthiasmullie/minify

Hoặc chỉnh sửa

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
5 của bạn, thêm dòng sau vào yêu cầu của bạn rồi thực thi
{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
6

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}

Và sau đó bạn sẽ có thể sử dụng Minify

Cài đặt không có nhà soạn nhạc

Nếu bạn không sử dụng trình soạn nhạc thì quá trình cài đặt có thể lâu hơn một chút. Đầu tiên, hãy tải xuống kho lưu trữ dưới dạng. zip từ kho lưu trữ tại đây hoặc chỉ cần sao chép nó bằng Git

git clone https://github.com/matthiasmullie/minify.git

Gói này phụ thuộc vào Path Converter, do đó bạn cũng cần sao chép kho lưu trữ này (hoặc tải xuống

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
7 của kho lưu trữ)

git clone https://github.com/matthiasmullie/path-converter.git

Ghi chú

Đảm bảo rằng bạn giữ nguyên cấu trúc thư mục (các tệp trong

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
8 phải ở cùng một vị trí so với
{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
9) cho cả Minify và Path Converter

Bây giờ, nếu bạn không sử dụng trình soạn thảo, thì có thể bạn có một thư mục dành cho thư viện của bên thứ ba, bên trong thư mục này, bạn sẽ dán (tương ứng.

git clone https://github.com/matthiasmullie/minify.git
0 và
git clone https://github.com/matthiasmullie/minify.git
1) nội dung của thư mục
git clone https://github.com/matthiasmullie/minify.git
2 của mọi thư viện trong một thư mục có tên thư viện

Cuối cùng, hãy bao gồm các tệp bắt buộc của thư viện trong mã mà bạn muốn sử dụng bằng cách sử dụng

git clone https://github.com/matthiasmullie/minify.git
3

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
3

Và bạn đã sẵn sàng sử dụng Minify trong mã của mình

Cách sử dụng

Để biết cách rút gọn Javascript với thư viện này, bạn có thể xem các ví dụ sau

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
4

Và để thu nhỏ CSS (nó hoạt động theo cách tương tự để nén Javascript nhưng với lớp CSS), hãy sử dụng đoạn mã sau

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
5

Chúng tôi khuyên bạn nên truy cập kho lưu trữ để biết thêm thông tin về các phương pháp tại đây

2. Nén Javascript bằng Bóp

Để nén mã Javascript, chúng tôi khuyên bạn nên sử dụng Squeeze. Squeeze thu nhỏ, nén, thu nhỏ và xáo trộn mã Javascript. Đó là một lớp PHP duy nhất đã được phát triển, duy trì và kiểm tra kỹ lưỡng từ năm 2003 trên các khung JavaScript chính (e. g. jQuery). JSqueeze hoạt động trên mọi mã JavaScript không có lỗi phân tích cú pháp, ngay cả khi thiếu dấu chấm phẩy. Về tỷ lệ nén, nó so sánh với YUI Compressor và UglifyJS

Chúng tôi khuyên bạn nên Bóp vì nó

  • Xóa nhận xét và khoảng trắng
  • Đổi tên mọi vars cục bộ, thường thành một ký tự
  • Giữ bình luận có điều kiện của Microsoft
  • Để tối đa hóa quá trình nén HTTP sau này (deflate, gzip), các tên biến mới được chọn bằng cách xem xét các lần đóng, tần suất của biến và tần suất của ký tự
  • Cũng có thể đổi tên các vars, phương thức và thuộc tính toàn cầu, nhưng chỉ khi chúng được đánh dấu đặc biệt bởi một số quy ước đặt tên. Sử dụng JQueze. SPECIAL_VAR_PACKER để đổi tên các vars có tên bắt đầu bằng một hoặc nhiều
    git clone https://github.com/matthiasmullie/minify.git
    4 hoặc bằng một
    git clone https://github.com/matthiasmullie/minify.git
    5
  • Đổi tên các vars cục bộ/toàn cầu được tìm thấy trong các chuỗi, nhưng chỉ khi chúng được đánh dấu đặc biệt
  • Nếu bạn sử dụng
    git clone https://github.com/matthiasmullie/minify.git
    6 thì hãy cẩn thận
  • Thay thế
    git clone https://github.com/matthiasmullie/minify.git
    7 bằng
    git clone https://github.com/matthiasmullie/minify.git
    8
  • Thay thế
    git clone https://github.com/matthiasmullie/minify.git
    9 bằng
    git clone https://github.com/matthiasmullie/path-converter.git
    0
  • Hợp nhất các khai báo
    git clone https://github.com/matthiasmullie/path-converter.git
    1 liên tiếp bằng dấu phẩy
  • Hợp nhất các chuỗi nối liên tiếp
  • Có thể thay thế dấu chấm phẩy tùy chọn bằng nguồn cấp dữ liệu dòng, do đó tạo điều kiện gỡ lỗi đầu ra
  • Giữ các nhận xét quan trọng được đánh dấu bằng
    git clone https://github.com/matthiasmullie/path-converter.git
    2
  • Coi ba dấu chấm phẩy
    git clone https://github.com/matthiasmullie/path-converter.git
    3 như chú thích một dòng
  • Sửa phạm vi bắt đặc biệt trên các trình duyệt
  • Xử lý lỗi xử lý các biểu thức hàm được đặt tên trong IE<=8

Thực hiện theo các cài đặt của Bóp

với nhà soạn nhạc

Để cài đặt Squeeze trong dự án của bạn, hãy thực hiện lệnh sau

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
6

Hoặc sửa đổi tệp

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
5, thêm dòng sau vào yêu cầu rồi thực thi
{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
6

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
9

Sau khi cài đặt, bạn sẽ có thể rút gọn mã bằng Squeeze

không có nhà soạn nhạc

Nếu bạn không sử dụng trình soạn thảo, bạn có thể dễ dàng sử dụng Bóp bằng cách sao chép tệp JSQueeze. php và đưa nó vào dự án của bạn bằng cách sử dụng

git clone https://github.com/matthiasmullie/minify.git
3

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
1

Cách sử dụng

Cách sử dụng Squeeze khá đơn giản và có thể đạt được chỉ bằng 1 phương pháp. Phương pháp này là ép

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
0

Là tham số đầu tiên của chức năng, hãy cung cấp mã Javascript cần được rút gọn

Tham số thứ hai

git clone https://github.com/matthiasmullie/path-converter.git
7 cho phép bạn quyết định xem bạn có muốn giữ lại dòng ngắt nếu tìm thấy dấu chấm phẩy hay không. Thông thường, chúng tôi muốn giá trị này luôn được đặt thành true

Tham số thứ ba

git clone https://github.com/matthiasmullie/path-converter.git
8 cho phép bạn quyết định xem bạn có muốn xóa nhận xét của
git clone https://github.com/matthiasmullie/path-converter.git
9 hay không

Tham số thứ tư

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
30 xác định biểu thức chính quy của các tên biến đặc biệt cho các phương thức, thuộc tính toàn cầu và thay thế chuỗi, đặt thành false nếu bạn không muốn

3. Nén Javascript bằng JShrink

JShrink là một công cụ khai thác javascript được viết bằng PHP. Nó được thiết kế để lấy các tệp javascript lớn và loại bỏ bit thừa, giúp tải xuống nhanh hơn. JShrink có một số lợi thế so với các thư viện khác. Vì nó được viết bằng php gốc, thay vì được chuyển, nên nó có hiệu suất tốt hơn. Nó có một số tính năng bổ sung, như khả năng giữ lại dữ liệu cấp phép sau khi thu nhỏ nội dung khác

với nhà soạn nhạc

Để sử dụng JShrink trong dự án của bạn, hãy thực hiện lệnh sau

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
1

Hoặc chỉnh sửa tệp

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
5 của bạn và thêm dòng yêu cầu sau rồi thực thi
{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
6

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
2

không có nhà soạn nhạc

Nếu bạn muốn sử dụng JShrink mà không cần trình soạn thảo, chỉ cần bao gồm Công cụ khai thác. lớp php của thư viện bằng cách sử dụng

git clone https://github.com/matthiasmullie/minify.git
3

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
3

Cách sử dụng

Việc sử dụng JShrink khá đơn giản, clas Minifier cung cấp quyền truy cập vào phương thức tĩnh thu nhỏ. Phương thức này mong muốn tham số đầu tiên là chuỗi Javascript được rút gọn và tham số thứ hai là một mảng có các tùy chọn (thực tế, chỉ có 1 tùy chọn duy nhất là

{
    "require": {
        "matthiasmullie/minify": "^1.3"
    }
}
34)