Pag-aayos ng Mga Isyu sa Pagganap sa Mabagal na Mga Site

Kung ang iyong site ay gumagalaw tulad ng isa sa mga sloths mula sa DMV sa Zootopia, may mga paraan na maaari mong ayusin ang anumang nagpapabagal dito. Ang pag-alam kung ano ang sanhi ng problema ay kalahati ng labanan, kaya sa sandaling ihiwalay mo ang mga sanhi, magkaroon ka man lang ng mga sagot sa paglutas ng problema.

Ang mababang kalidad ng pagho-host ay malamang na may kasalanan

Pagdating sa web hosting, ang konsepto ng mababang kalidad ay hindi palaging nangangahulugan ng parehong bagay na ginagawa nito sa iba pang mga konteksto. Halimbawa, ang presyong binabayaran mo para sa pagho-host ay hindi palaging isang tumpak na pagsasalamin ng kalidad na maaari mong asahan. Ni ang katanyagan ng serbisyo o kung gaano kakilala ang tatak ng pangalan.

Sa katunayan, ang ilan sa mga pinakatanyag na tatak sa pagho-host ay ang pinakapangit na pagpipilian, dahil lamang sa maraming tao ang gumagamit sa kanila. Depende ito nang kaunti sa kalidad ng kanilang imprastraktura. Kung namumuhunan sila nang maayos sa kanilang teknolohiya, maaaring hindi ka makaranas ng mga makabuluhang isyu sa pagganap. Sa kabilang banda, maaaring nagbabahagi ka ng isang solong server sa daan-daang iba pang mga site, at tataas ang problemang iyon habang patuloy na lumalaki ang kapasidad ng imbakan ng disk.

Kaya't sa sitwasyong iyon, posible na ang paglipat sa isang maliit, hindi gaanong kilalang web hosting service na may mahusay na teknolohiya ay maaaring isang mas mahusay na pagpipilian. Ang paggawa nito ay maaaring nangangahulugan din na makakakuha ka ng higit pang personal na serbisyo sa customer, sa isang mas mataas na antas ng kalidad kaysa sa makukuha mo mula sa isang behemoth. Ito ay nagkakahalaga ng pag-iisip tungkol sa, at madaling subukan sa pamamagitan lamang ng pagbili ng isang buwan na subscription sa bagong host at benchmarking ang pagganap laban sa iyong mayroon nang site.

Gamitin ang iyong F12 key

Karamihan sa mga web browser ay naayos upang ma-access ang kanilang debug console sa pamamagitan ng F12 key, at ang sa iyo ay malamang na hindi isang pagbubukod. At nagsasalita ng mga pagbubukod, iyon talaga ang iyong hinahanap, o upang maging tumpak, mga error sa iyong JavaScript code na nagtatapon ng mga pagbubukod at nakakaapekto sa pagganap.

Mahahanap mo ang mga error na ito kapwa sa iyong sariling code at sa mga nai-import na library ng code tulad ng jQuery. Dahil lamang sa ang jQuery ay malaki at popular ay hindi nangangahulugang ito ay walang kamali-mali. Narito ang isang halimbawa ng uri ng bagay na iyong hinahanap:

Ang mga error na naka-flag na asul ay mga error lamang sa CSS at maaari mong asahan na makita ang mga iyon dahil sa dami ng kailangang gawin ng mga nag-develop ng shirk kapag nagtatayo ng mga sheet ng istilo, dahil lamang sa wala pa ring isang pamantayan na pinagtibay sa lahat ng mga browser. Hindi nila dapat normal na makaapekto sa pagganap maliban kung gumagamit ka ng maraming mga animasyon o mga epekto ng transistion.

Ngunit ang error na na-flag sa orange ay isang error sa JavaScript, at hindi lamang iyon, sa kasong ito ang jackpot dahil partikular na sinasabi nito sa amin na ang partikular na error na ito ay magiging sanhi ng pagpapatakbo ng code nang napakabagal.

Kumuha ng ilang libreng payo mula sa Google

Alam mo bang maaaring suriin ng Google ang iyong web page nang libre at bibigyan ka ng mga tip tungkol sa kung paano ayusin ang anumang mga isyu? Ang kailangan mo lang gawin ay bisitahin ang pahina ng Mga Pananaw sa Bilis ng Pahina ng Google at ipasok ang URL ng pahina na nais mong pag-aralan.

Talagang hindi ito magiging mas madali, kahit na maaaring hindi mo kinakailangang sundin sa relihiyon ang lahat ng kanilang payo. Ang system ng Google ay mahusay sa pag-alam kung ano ang maaaring makapagpabagal ng iyong pahina, ngunit ang ilang mga pag-aayos ay maaaring hindi malutas ang maraming mga problema habang nilikha nila.

Sa isip na nais mong makita ang mga marka sa itaas ng 85. Habang walang tiyak na nakakaalam, ang mga oras ng paglo-load ng pahina ay malawak na naisip na magkaroon ng isang makabuluhang impluwensya sa ranggo ng iyong pahina sa Google. Huwag mawalan ng pag-asa kung ang iyong site ay hindi naroroon sa tuktok ng berdeng zone, dahil maraming mga pangunahing website ang hindi nakakakuha ng kamangha-manghang mga marka.

Ang ilang mga kapansin-pansin na halimbawa ay kinabibilangan ng:

  • http://bbc.com (70m/77d)
  • http://cnn.com (47m/65d)
  • http://whitehouse.gov (58m/56d)
  • http://microsoft.com (49m/71d)
  • http://apple.com (61m/72d)
  • http://linux.com (33m/44d)
  • http://ubuntu.com (69m/81d)
  • http://linuxmint.com (59m/67d)
  • http://youtube.com (53m/69d)
  • http://facebook.com (49m/81d)

Wala sa mga halimbawang ito ang talagang dahilan upang hayaan ang iyong sariling site na gumanap nang hindi maganda, ngunit pinatunayan nila na ang isang mabagal na site ay hindi kinakailangang magkasingkahulugan ng pagkabigo.

Gumamit ng mga imahe nang tama

Kung may makakaalam ng tamang mga format ng imahe na gagamitin at kailan, dapat ito ay mga tagadisenyo, tama? Ngunit kamangha-manghang tila marami sa iyong hindi alam, o kapag alam mo, sa palagay mo hindi mahalaga. Narito ang balita: mahalaga ito, sa lahat ng oras.

Ang problemang ito ay nagtitipon ng momentum dahil ang isang tiyak na istilo ng template ay pinagtibay bilang pamantayan ng defacto para sa mga site ng negosyo, at ito ay isang kalakaran na hindi nagpapakita ng mga palatandaan ng pagbagal. Bilang isang propesyonal na taga-disenyo, utang mo sa iyong sarili at sa iyong mga kliyente na huwag mahulog sa bitag ng mga tamad na mga shortcut sa disenyo.

Ang isa sa mga kapus-palad na mga shortcut na ito ay gumagamit ng malalaking mga imahe ng PNG para sa mga yunit ng bayani sa tuktok ng isang pahina (o saanman, ngunit doon mo makikita ang mga ito). Ngayon, hindi na sinasabi na hindi mo dapat gawin ito kailanman, kahit na nangangailangan ka ng mga transparent na seksyon sa imahe.

Narito ang mga pangunahing kaalaman na dapat mong tandaan kapag lumilikha ng obra maestra na iyon:

  • Gumamit ng malalaking imahe kung matipid

Ang mga malalaking imahe ay isang kahila-hilakbot na ideya dahil kung mas malaki ang imahe, mas matagal ang pag-load. Ngayon may ilang iba't ibang mga diskarte na maaari mong gamitin upang mas mahusay na gumana ang malalaking imahe, ngunit bago natin ito masabi, sabihin nalang natin na dapat kang gumamit ng mas maliit na mga imahe sa karamihan ng oras, at makatipid ng malalaki para sa kung kailan sila kailangan talaga.

  • Itakda ang halagang PPI / DPI nang naaangkop

Nakasalalay sa kung anong graphic editor ang iyong ginagamit, maaari itong magpakita ng mga halaga para sa DPI o PPI. Ang huli ay mas mahusay, dahil ipinapahiwatig nito ang iyong graphics editor ay idinisenyo para sa paggamit ng web sa halip na i-print. Ang problema sa pagbabago ng DPI sa ilang mga bersyon ng PhotoShop ay na aayusin nila hindi lamang ang DPI kundi pati na rin ang mga pisikal na sukat ng iyong imahe din. Hindi ito isang problema sa pinakabagong bersyon ng PhotoShop (na gumagamit ng PPI), kaya kung gumagamit ka ng isang mas lumang bersyon, oras na upang mag-upgrade. O sa halip ay gumamit ng GIMP.

  • Hiwain ang malalaking imahe

Dito nagsisimula ang mahika. Mahahanap mo ang maraming tao na nagsasabi sa iyo na ang pagpipiraso ng iyong mga imahe ay hindi nagpapabuti ng mga oras ng paglo-load dahil nagda-download ka pa rin ng parehong bilang ng mga byte at ang anumang pinaghihinalaang pagpapabuti ay sikolohikal lamang. Ang mga taong iyon ay gumagamit ng pinakatamad na bersyon ng pagpipiraso ng imahe, kaya hindi nila alam ang totoong mga posibilidad.

Matapos ang paggupit ng iyong imahe, mayroon kang pagkakataon na i-optimize ito. Ipagpalagay na ang orihinal na imahe ay nasa format na PNG, maaari mo na ngayong mai-convert ang anumang mga hindi malinaw na bahagi sa format na JPG, at makatipid ng maraming mga byte, naiwan ang mga bahagi na nangangailangan ng transparency bilang mga imahe ng PNG.

Susunod na maaari mong i-play sa antas ng compression ng bawat indibidwal na hiwa hanggang sa ang hiwa na ay perpektong na-optimize. Ang pangkalahatang epekto ng pag-optimize na ito ay maaaring magresulta sa pagtitipid na higit sa 50% sa paghahambing sa orihinal na hindi na -optimize na imahe.

Ang video ay maaaring ma-optimize din

Ang sining ng compression ng video ay nakasalalay sa dalawang bagay: ang target na format at ang codec na ginagamit mo para sa pag-encode. Aling format ang pipiliin mo ay nakasalalay sa iyong mga pangangailangan. Sa pangkalahatan, kung kailangan mo ng mataas na kalidad, ang MP4 na may H.264 encoding ay magbibigay ng pinakamahusay na kalidad sa mataas na compression, ngunit kapag hindi mo kailangan ang mataas na kalidad, ang WebM at FLV ay nagbibigay ng mas maliit na mga laki ng file. Ang iyong software sa pag-edit ng video ay maaari pa ring mag-alok ng FLV bilang isang pagpipilian, ngunit hindi inirerekumenda na gamitin ang format na ito.

Kung kailangan mo ng kalidad ng DVD, ang MP4 na may pag-encode ng H.264 ay magbibigay ng mahusay na mga resulta, ngunit nagkakahalaga ng pagiging mabigat na pag-download. Para sa streaming na video, nagbibigay ang WebM ng mas mahusay na compression. Ang problema ay hindi lahat ng mga operating system ng mobile ay sumusuporta pa sa WebM (dapat, ngunit lumilitaw na mayroon silang mabaliw na dahilan na hindi, posibleng pagsunod sa ginintuang patakaran ng developer ng mobile: maaabala ka at malito mo ang iyong customer hangga't maaari mong gawin).

Dapat mo bang gamitin ang MPEG-4 codec sa halip na H.264 sa mga MP4 na video? Karaniwan hindi, sapagkat nagreresulta ito sa mas malaking sukat ng file sa parehong antas ng kalidad. Ngunit kung ang iyong video ay magkakaroon ng maliliit na sukat sa pisikal, at nais mo ng perpektong paghahatid ng video para sa streaming, ang MPEG-4 ay isang mahusay na codec dahil mayroon itong built-in na pagwawasto ng error upang matiyak ang integridad ng data.

Kumusta naman ang WMV? Ito ay isang espesyal na kaso. Nagbibigay ito ng halos parehong kalidad ng video bilang MP4, ngunit may mas mahusay na compression. Ang downside dito ay maaari lamang matingnan ng mga gumagamit ng Mac at iOS ang iyong video kung gumagamit sila ng isang payware video converter, na nagpapakilala ng pagkaantala sa pag-playback, na eksaktong bagay na sinusubukan naming iwasan sa pag-optimize ng aming pahina.

Ang mga WMV file ay walang anumang mga isyu para sa mga gumagamit ng Android, Windows, o Linux. Ngunit sa 12.5% ​​ng pamayanan sa Internet na gumagamit ng mga aparatong Apple, kakailanganin mong magpasya kung ito ay nagkakahalaga ng pag-abala sa kanila. Sa personal hindi ko inirerekumenda na gawin mo iyon upang makakuha ng mas mabilis na oras ng pag-load.

At sa wakas, dahil ito ay video sa internet, kung hindi mo pinapayagan ang pag-playback ng full-screen o teatro mode, pag-urong ang pisikal na sukat ng video hanggang sa laki na ipapakita mo sa iyong pahina, at tingnan kung gaano karaming mga byte ang maaari mong mai-save .

Bogdan Rancea

Si Bogdan ay isang founding member ng Inspired Mag, na naipon ang halos 6 na taong karanasan sa panahong ito. Sa kanyang bakanteng oras gusto niyang mag-aral ng klasikal na musika at galugarin ang visual arts. Medyo nahuhumaling rin siya sa mga fixies. Nagmamay-ari na siya ng 5.