✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

Kuvan optimointi artisansweb / image-optimizer -paketilla

21

Nyt on kulunut 4 vuotta, ja pidän tätä blogia. Tämän blogin ohella käytän myös YouTube-kanavaa, jossa jaan videoita, jotka osoittavat artikkeleideni toteuttamisen.

Uskon avoimeen lähdekoodiin. En omista verkkosivustollani mitään maksettua jäsenyyttä, myydä e-kirjoja tai kursseja. Haluan pitää resurssit vapaina. Tässä mielessä olen luonut ensimmäisen GitHub-pakettini artisansweb / image-optimizer, joka hoitaa kuvien optimoinnin verkkosivustollesi.

Kirjoitin muutaman artikkelin kuvien optimoinnista aiemmin. Toistaiseksi TinyPNG oli suosikkini ja silti. Mutta TinyPNG: n rajoitus on, että ne mahdollistavat 500 ilmaisen kuvan optimoinnin kuukaudessa. Yli 500 kuvan kohdalla lataat kuvaa kohti.

Muutama edellinen artikkeli kuvan optimoinnista:

Myös muita paketteja on, mutta ne edellyttävät, että asennamme koneellemme ohjelmistot, kuten JpegOptim, Optipng jne. Se ei myöskään ole toteutettavissa oleva ratkaisu.

Viime vuonna työskentelin asiakkaan projektissa, jonka pakkaamiseen tarvitaan tuhansia kuvia. Etsimme avointa lähdekoodia ja tehokasta palvelua, joka voi tehdä työmme. Sitten saimme tietää reSmush.it-sivustosta, joka on täysin ilmainen palvelu kuvien optimoimiseksi.

Vaikka kirjoitin artikkelin reSmush.it -sivustolta, tunnen voivani luoda siitä GitHub-paketin ja tein niin. Jos luet artikkelini reSmush.it -sivustolla, huomaat, että sen on lisättävä noin 25-30 koodiriviä. Mutta jos valitset paketin, se voidaan tehdä 5-6 rivillä.

Siitä huolimatta keskustellaan artisansweb/image-optimizerpaketin asentamisesta ja käytöstä .

Kuvan optimointi PHP: llä

Aluksi sinun on asennettava paketti Composerin avulla suorittamalla komento:

composer require artisansweb/image-optimizer

Paketin asennuksen jälkeen voit optimoida kuvan alla olevan koodin avulla.

<?php
require_once "vendor/autoload.php";
 
use ArtisansWebOptimizer;
 
$img = new Optimizer();
 
$source = 'SOURCE_PATH_OF_IMAGE';
$img->optimize($source);

Tässä sinun on läpäistävä lähdekuvan koko hakemistopolku, ja lähdekuvasi optimoidaan automaattisesti. Joskus sinun on pidettävä alkuperäinen kuva ja tallennettava optimoitu versio toiseen hakemistoon. Siinä tapauksessa voit käyttää toista parametria määränpäähän.

<?php
$source = 'SOURCE_PATH_OF_IMAGE';
$destination = 'DESTINATION_PATH_OF_IMAGE';
$img->optimize($source, $destination);

Yllä olevaa koodia käyttämällä voit optimoida kuvasi, jotka ovat hakemistossasi. Suosittelen kuitenkin lataamaan kuvan optimointia, jotta sinun ei tarvitse suorittaa optimointitehtäviä erikseen.

Käyttäjä voi optimoida lataamansa kuvan seuraavasti.

<?php
require_once "vendor/autoload.php";
 
use ArtisansWebOptimizer;
 
if (isset($_POST['submit'])) {
    $img = new Optimizer();
    move_uploaded_file($_FILES['file']['tmp_name'], 'images/'.$_FILES['file']['name']);
    $img->optimize('images/'.$_FILES['file']['name']);
}
?>
 
<form method="post" enctype="multipart/form-data">
    <input type="file" name="file" />
    <input type="submit" name="submit" value="Submit" />
</form>

Vaikka reSmush.it ovat toistaiseksi pakanneet miljardeja kuvia, voi olla mahdollista, että heidän palvelunsa on jostain syystä poissa käytöstä. Käsittelin tämän skenaarion paketissa. Jostain syystä, jos paketti ei saa optimoitua versiota reSmush.it: ltä, se käyttää varalla optimointiin PHP: n natiivimenetelmiä, kuten imagecreatefromjpeg, imagecreatefrompng, imagecreatefromgif, imagejpeg.

Käynnissä on useita uusia ominaisuuksia, jotka lisätään pakettiin ja julkaisen sen pian.

Olen iloinen, jos käytät pakettia ja kerro minulle, miten se toimii alla olevassa kommenttiosassa. Jaa palautteesi, jotta voimme yhdessä parantaa tätä pakettia, joka auttaa yhteisöä.

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja