Ahoana ny fomba fampiasana fitaovana mpamorona tranonkala

Fitaovana enti-matihanina ho an'ny mpamorona tranonkala, mpandrindra ary testers

Ankoatra ny ankamaroan'ny mpamokatra tranonkala mifantoka amin'ny mpisera isan'andro izay mijery ny tranonkala, dia mikarakara ireo mpikirakira ny tranonkala, mpanamboatra sy matihanina matihanina izay manampy amin'ny fananganana ireo rindrambaiko sy tranonkala ahafahan'ireo mpampiasa mampiasa izany fitaovana matanjaka izany ao anaty browsers ny tenany.

Vitanay ny andro izay hany fitaovana fandaharana sy fitaovana fitsapana hita ao anaty tranokala iray ahafahanao mijery ny loharanom-baovaon'ny pejy ary tsy misy zavatra hafa. Ireo mpitsidika androany dia mamela anao haka lalindalina lalindalina kokoa amin'ny fanaovana zavatra toy ny famoahana sy famoahana JavaScript snippets, fanaraha-maso sy fanitsiana ireo singa DOM, manara-maso ny fifamoivoizana amin'ny tambajotra amin'ny fotoana mety toy ny fampiharana na pejy entina hamantarana ireo tavoahangy, fandinihana ny fahombiazan'ny CSS, tsy mampiasa fahatsiarovana be loatra na faran'ny CPU loatra, ary betsaka kokoa. Avy amin'ny fomba fijery fikarohana, dia azonao atao ny mamerina hoe ahoana ny fampiharana na ny tranonkala amin'ny tranokala isan-karazany, ary amin'ny fitaovana sy sehatra samihafa amin'ny alalan'ny môtika misy ny famolavolana mamolavola sy ny simulateur fanorenana. Ny ampahany tsara indrindra dia ny fahafahanao manao izany rehetra izany raha tsy miala amin'ny tranonao ianao!

Ireo lesona etsy ambany dia mandeha aminao amin'ny alalànao ny fomba hidirana amin'ireo fitaovana fampandrosoana ao amin'ny tranonkala malaza maro.

Google Chrome

Ny fitaovana famolavolana Chrome dia mamela anao hanova sy hanodina ny kaody, hanaraha-maso ny singa tsirairay mba hampisehoana ny olana momba ny zava-mitranga, manamboatra sary misy rindrambaiko isan-karazany, anisan'izany ireo izay mihazakazaka Android na iOS , ary manao asa maro hafa mahasoa.

1. Tsindrio eo amin'ny bokotra maina Chrome an'ny Chrome, voamarika miaraka amin'ny andalana telo horizontaly ary hita ao amin'ny zoro havanana amin'ny havanana.
2. Rehefa miseho ny fanontana misimisy dia afantohy ny cursor maody amin'ny safidy More Tools.
3. Tokony hisy ny sub-menu izao. Safidio ny safidy misy ny fitaovana Developer . Azonao ampiasaina ihany koa ny fampiasana an'ity takelaka ity: Chrome OS / Windows ( CTRL + SHIFT + I ), Mac OS X ( ALT (OPTION) + COMMAND + I )
4. Ny tranonkala Chrome Developer Tools dia tokony aseho izao, araka ny aseho amin'ity screenshot ity. Miankina amin'ny kitonao Chrome ianao, ny takelaka voalohany izay hitanao dia mety ho hafa noho izay naseho eto. Ny foiben'ny fitaovam-pampandrosoana, izay matetika hita ao amin'ny faritra ilany na eo ankavanan'ny efijery, dia mirakitra ireto takelaka manaraka ireto.
   Elements: Manampy ny fahaizana manara-maso ny code CSS sy HTML ary ny fanitsiana CSS on-the-fly, mahita ny fiantraikan'ny fanovana anao amin'ny fotoana tena izy.
   Console: Console JavaScript an'ny Chrome dia mamela ny fidirana an-tsehatra mivantana ary koa ny debugging fanandramana.
   Loharano: Mamela ny famaha ny code JavaScript amin'ny alàlan'ny endritsoratra matanjaka iray.
   Network: Manasokajy sy mampiseho ny antsipirian'ny antsipirihany momba ny fampiharana mifandraika amin'ny fampiharana na pejy mavitrika, anisan'izany ny fangatahana feno sy ny valinteny amin'ny valinteny, ary koa ny mombamomba ny fotoana fohy.
   Fotoam-pamokarana: Mamela fandalinana lalina momba ny asa rehetra atao ao anaty tranokala raha vao manomboka ny fangatahana pejy na fangatahana app.
5. Ankoatra ireo sehatra ireo, dia azonao atao ihany koa ny miditra amin'ireo fitaovana manaraka amin'ny alàlan'ny >> icon, eo ankavanan'ny tabilan'i Timeline .
   Profile: Nopotehina tao amin'ny profiler ny CPU sy ny Heap profiler Heap , manome fampiasa feno fahatsiarovana sy fotoana famonoana tanteraka ny fampiharana na pejy mavitrika.
   Fiarovana: Manasongadina olana momba ny fahazoan-dàlana sy olana hafa momba ny fiarovana amin'ny pejy na fampiharana.
   Fitaovana: Ity dia afaka manara-maso ny cookies, tahiry ao an-toerana, cache app, ary loharanom-baovao hafa ao an-toerana ampiasain'ny pejy web na fampiharana.
   Fitsitsiana: Manolotra fomba hanatsarana ny pejy iray na ny ora entin'ny fampiharana sy ny fampisehoana ankapobeny.
6. Ny Mode Device dia ahafahanao mijery ny pejy mavitrika amin'ny simulator izay manome azy io ho toy ny hita amin'ny iray amin'ireo fitaovana mihoatra ny ampolony, anisan'izany ny marika maromaro amin'ny Android sy iOS toy ny iPad, iPhone, ary Samsung Galaxy. Azonao omena ihany koa ny fahafahana mamolavola ny tolo-kevitry ny ordinateranao mba hifanaraka amin'ny filànao manokana na ny fitsaboana. Ampifanaraho amin'ny rindrin'ny Elements ny rindran- telefaona finday mivantana eo ankavanan'ny tabilao Elements .
7. Azonao atao koa ny mampifanaraka ny fijerinao sy ny fahatsapanao amin'ireo fitaovana enti-manamboatra anao amin'ny alàlan'ny fanindriana voalohany ny totozy fisehoana an-tsehatra misy tarehimarika mifatotra amin'ny sehatra telo ary hita eo amin'ny lafiny havia havia amin'ireo tabilao voalaza etsy ambony. Avy ao anatin'ity menio fanontam-pirinty ity, afaka mamerina manamboatra ny dock ianao, mampiseho na manafina fitaovana maro samihafa ary manomboka ireo fitaovana mivoatra kokoa toy ny mpanara-maso ny fitaovana. Hahita ianao fa ny fitaovana dev ho an'ny dev-tena dia tena azo amidy amin'ny alàlan'ny fanovana hita ato amin'ity fizarana ity.

Mozilla Firefox

Ny sehatry ny Developer amin'ny Firefox dia ahitana fitaovana ho an'ny mpamorona, mpandrindra ary testers, toy ny tonian-dahatsary sy sary sokitra.

Famakian-teny: Ny Top 25 Greasemonkey sy Tampermonkey User Scripts

1. Tsindrio eo amin'ny bokotra main menu an'ny Firefox, izay aseho amin'ny laha-dàlana telo ary hita ao amin'ny zoro havanana amin'ny rindrin'ny tranokala.
2. Rehefa miseho ny menio fanontana, dia fidio ilay mari-pamantarana misy ny Developer . Ny menokan'ny Developer Web dia tokony haseho izao, ary ahitana ireto safidy manaraka ireto. Ho hitanao fa ny ankamaroan'ny zavatra ao amin'ny sakafo dia manana fikandrana klavier mifandray amin'izy ireo.
   Ny fitaovana fanodinana : Mampiseho na manafina ny interface interface amin'ny fitaovana famolavolana, izay mipetaka eo amin'ny faritry ny varavarankala. Kitapo fintina: Mac OS X ( ALT (OPTION) + COMMAND + I ), Windows ( CTRL + SHIFT + I )
   Inspektora: Azonao atao ny manara-maso sy / na mampifanaraka ny code CSS sy HTML eo amin'ny pejy mavitrika ary amin'ny alalan'ny fitaovana portable amin'ny alàlan'ny debogging. Kitendry hitsin-dàlana: Mac OS X ( ALT (OPTION) + COMMAND + C ), Windows ( CTRL + SHIFT + C )
   Web Console: Mamela ny famoahana JavaScript eo amin'ny pejy mavitrika ary avereno jerena ny andian-drakitra maro samihafa ao anatin'izany ny fampitandreman'ny fiarovana, ny fangatahan'ny tambajotra, ny hafatra CSS, ary bebe kokoa. Famintinana klavye: Mac OS X ( ALT (OPTION) + COMMAND + K ), Windows ( CTRL + SHIFT + K )
   Debugger: Ny Mpiblôgy JavaScript dia mamela anao hamaha ny olana sy hamaha ny olana amin'ny alàlan'ny fandefasana fisafotofoto, fanaraha-maso ny rindran-damba DOM, bokotra mainty avy any ivelany, ary zavatra maro hafa. Tahaka ny tranga amin'ny Inspector , ity fisy ity dia manohana ihany koa ny famoahana lavitra. Kitendry hitsin-dàlana: Mac OS X ( ALT (OPTION) + COMMAND + S ), Windows ( CTRL + SHIFT + S)
   Mpanonta Toerana : Azonao atao ny manangana endrika ambaratonga vaovao ary mampiditra azy ireo miaraka amin'ny tranonkala mavitrika, na hanova ireo taratasy efa misy ary mijery ny fanovana ataonao amin'ny navigateur amin'ny alalan'ny kitiho iray monja. Famintinana klavye: Mac OS X, Windows ( SHIFT + F7 )
   Performance: Mamolavola ny antsipirian'ny pejy ho an'ny tambajotra an-tserasera, tahirin-tsarimihetsika, famokarana JavaScript Java ary fanjakana, loko marefo, ary zavatra hafa. Famintinana klavye: Mac OS X, Windows ( SHIFT + F5 )
   Tetikasa: Manolotra ny fangatahana eo amin'ny sehatry ny serasera rehetra miaraka amin'ny fomba fitsaboana, ny sehatra fanombohana, ny karazana, ny habe ary ny fotoana lavareny. Kitapo Keyboard: Mac OS X ( ALT (OPTION) + COMMAND + Q ), Windows ( CTRL + SHIFT + Q )
   Developer Toolbar: Manokatra interpreter baikon'ny interaktive. Mampidira fanampiana amin'ny mpandika teny amin'ny lisitry ny baiko rehetra misy sy ny fepetra mety aminy. Famintinana klavye: Mac OS X, Windows ( SHIFT + F2 )
   WebIDE: Manampy ny fahafahana mamorona sy mampihatra apps amin'ny Internet amin'ny alalan'ny fitaovana maoderina Firefox OS na amin'ny Firefox OS Simulator. Kitapo fohy: Mac OS X, Windows ( SHIFT + F8 )
   Console Browser: Manomeza fonosana mitovy amin'ny Web Console (jereo eto ambony). Na izany aza, ny angona rehetra naverina dia natao ho an'ny fampiharana Firefox rehetra (anisan'izany ny fanitarana sy ny lahasa amin'ny sehatry ny tranokala) fa tsy ny tranonkala mavitrika fotsiny. Kitapo fohy: Mac OS X ( SHIFT + COMMAND + J ), Windows ( CTRL + SHIFT + J )
   Famelabelaran-kevitra amin'ny famolavolana: Mamela anao hijery sary maimaim-poana amin'ny tranokala Web ao amin'ny famolavolana, fampisehoana, ary seho an-tsarimihetsika mba hamintina ireo fitaovana maro misy tablette sy smartphones. Kitendry hitsin-dàlana: Mac OS X ( ALT (OPTION) + COMMAND + M ), Windows ( CTRL + SHIFT + M )
   Mpandoka: Mampiseho ny mari-pamantarana hosoka ho an'ny pikantsary voafaritra tsirairay.
   Scratchpad : Azonao atao ny manoratra, manitsy, mampifandray ary manonta snippets of code ao amin'ny JavaScript ao amin'ny tranokala Firefox. Famintinana klavye: Mac OS X, Windows ( SHIFT + F4 )
   Loharanom-pejy: Ny fitaovana mpamorona tranokala fanoratana voalohany dia mampiseho fotsiny ny loharanon-drakitra ho an'ny pejy mavitrika. Famintinana klavye: Mac OS X ( COMMAND + U ), Windows ( CTRL + U )
   Manàna fitaovana fanampiny: Manokatra ny fanangonana Toolbox amin'ny tranonkala Developer amin'ny tranonkala ofisialy ofisialin'i Mozilla, izay manasongadina ampiana fanitarana malaza toy ny Firebug sy Greasemonkey.

Microsoft Edge / Internet Explorer

Raha ny fantatra dia ny F12 Developer Tools , ho fanomezam-boninahitra ny sora-podihezan-damba izay nametraka ny aterineto nanomboka tamin'ny dikan-teny taloha teo amin'ny Internet Explorer, ny fitaovana dev amin'ny IE11 sy Microsoft Edge dia efa lava be hatramin'ny nanombohany tamin'ny fanolorana vondrona vitsivitsy. mpanara-maso, debugger, emulateur, ary mpanamboatra on-the-fly.

1. Tsindrio eo amin'ny sehatr'asa misimisy kokoa , aseho amin'ny teboka telo ary hita ao amin'ny zoro havanana amin'ny rindrin'ny tranokala. Rehefa miseho ny fanontana misimisy , dia fidio ilay safidy misy ny F12 Developer Tools . Araka ny efa nolazaiko, afaka miditra amin'ny fitaovana ianao amin'ny alàlan'ny fametahana keyboard.
2. Tokony hampisehoana ny interface interface, amin'ny ankapobeny ao amin'ny fikandrana. Ireto fitaovana manaraka ireto dia misy, azo takarina amin'ny alàlan'ny fanindriana ao amin'ny loha-takila misy azy na amin'ny fampiasana ny takela-pifandraisana misy azy.
   DOM Explorer: Azonao atao ny manova ny stylesheets sy HTML ao amin'ny pejy mavitrika, mamoaka ny vokatra voaova rehefa mandeha ianao. Mampiasa ny fonosana IntelliSense amin'ny code autocomplete raha azo atao. Rakitra klavye: (CTRL + 1)
   Console: Manome ny fahafahana handefa ny fampiasana ny debugging, anisan'izany ny mpanaraka, ny fotoana, ny sora-baventy, ary ny hafatra manokana avy amin'ny API. Azonao atao koa ny mametraka fehezan-dalàna ao amin'ny tranonkala iray mavitrika ary manova ny soatoavina atolotra ho an'ny isam-batan'olona amin'ny fotoana tena izy. Famintinana klavye: (CTRL + 2)
   Debugger: Mamela fandaharana ianao ary mameno ny codeo raha toa ka manatanteraka, tsipika tsipika raha ilaina. Famintinana klavye: (CTRL + 3)
   Network: Manolotra ny fangatahana eo amin'ny sehatry ny seraseran'ny mpampita vaovao mandritra ny famoahana sy famonoana pejy, anisan'izany ny antsipirian'ny protocol, ny karazan-tserasera, ny fampiasana bandwidth, ary ny hafa. Famintinana klavye: (CTRL + 4)
   Fampahafantarana: Ny taham-panafahana Details, ny fampiasana ny CPU, ary ny hafainganana mifandraika amin'ny tetikasa izay hanampy anao hanatsara ny fotoana andrana entana pejy sy ny asa hafa. Famintinana klavye: (CTRL + 5)
   Tsiambaratelo: Manampy anao hitoka-monina sy hanitsiana ireo tebitebin'ny fahatsiarovan-tena ao amin'ny pejin-tranonkala amin'izao fotoana izao amin'ny alalan'ny fampisehoana ny fampiasana fahatsiarovan-dahatsary miaraka amin'ny fakana sary avy amin'ny fotoana samihafa. Famintinana klavye: (CTRL + 6)
   Famolavolana: Mampiseho anao ny fomba ahafahan'ny pejy mavitrika amin'ny raki-kevitra samihafa sy ny habeny, mametaka smartphones, takelaka, ary fitaovana hafa. Manolotra ihany koa ny fahafahana manova ny mpiasan'ny mpampiasa sy ny orientation amin'ny pejy, ary koa ny fanatsarana ny fiovaovan'ny toetr'andro amin'ny alàlan'ny miditra latitude sy longitude. Famintinana klavye: (CTRL + 7)
3. Mba hampisehoana ny Console raha eo amin'ny fitaovana hafa dia tsindrio eo amin'ny bokotra mitaingina azy eo an-kavanana, eo amin'ny zoro havanana amin'ny rindrin'ny fitaovana fampandrosoana.
4. Raha te hamafa, ny fitaovana famolavolana drafitra dia mba ho lasa varavarankely iray izy io, tsindrio ny bokotra asehon'ireo tsipika roa mivadika (cascading) na ampiasao ny takelaka fanalahidy manaraka: CTRL + P. Azonao atao ny mametraka ireo fitaovana miverina any amin'ny toerana niaviany amin'ny alàlan'ny fanindriana CTRL + P fanindroany.

Apple Safari (OS X fotsiny)

Ny fitaovana samihafa misafidy an'i Safari dia maneho ny vondrom-piarahamonina mpandrindra lehibe izay mampiasa Mac iray ho an'ny famolavolana sy ny fandaharanasa fandaharana. Ankoatra ny solosaina mahery vaika sy ny fampifanampiana nentim-paharazana sy ny famoahana, dia omena koa ny fomba fanodinana mora ampiasaina ary fitaovana iray ahafahana mamorona tranonkalanao manokana.

1. Tsindrio Safari ao amin'ny menio browser, hita eo an-tampon'ny efijery. Rehefa miseho ny menus lefona, select Preferences . Azonao atao ihany koa ny mampiasa an'ity takelaka fanalahidy manaraka ity ho solon'ity endritsoratra ity: COMMAND + COMMA (,)
2. Ny interface interface Safari dia tokony aseho ankehitriny, mametaka ny varavarankarin'ny fikandrana. Tsindrio eo amin'ny sivana Advanced , eo amin'ny sisiny ankavia amin'ny lohatenin'ny pejy.
3. Tokony ho hita ny safidy Advanced . Eo ambany elanelan'ity efijery ity dia misy safidy marihitra aseho Show Menu amin'ny Developer amin'ny menu bar , miaraka amin'ny boaty fanamarinana. Raha tsy misy marika famantarana hita ao anaty boaty, tsindrio eo indray raha hametraka ny iray eo.
4. Fenoy ny fikandrana Preferences amin'ny tsindrio ny 'x' mena hita eo amin'ny zoro ankavia havia.
5. Tokony ho hitanao fa misy safidy vaovao ao amin'ny menokan'ny tranokala antsoina hoe Develop , hita eo anelanelan'ny Bookmarks sy Window . Tsindrio ity sokajy ity. Tokony hipoitra ny sakafo fanontam-pirinty, miaraka amin'ireo safidy manaraka.
   Sokafy miaraka amin'ny: Mamela anao hanokatra ny tranonkala mavitrika amin'ny iray amin'ireo navigateur hafa izay mipetraka ao amin'ny Mac ianao.
   Mpandraharaha User: Mamela anao hifidy mihoatra ny am-polony ambin-tseraseran'ny mpisera efa voafaritra, anisan'izany ny dikan-teny maromaro amin'ny Chrome, Firefox ary Internet Explorer, ary mamaritra ny fombanao manokana.
   Ampidiro ny modely fanavaozana : Manova ny pejy amin'izao fotoana izao raha hiseho amin'ny fitaovana isan-karazany sy amin'ny famolavolana ny sary.
   Asehoy ny Inspector Web: Manomboka ny fitaovana lehibe ho an'ny fitaovana devariana Safari, izay aseho amin'ny faritry ny efijery fanovozam-pejy ary ahitana ireto fizarana manaraka ireto: Elements , Network , Resources , Timelines , Debugger , Storage , Console .
   Asehoy ny solosaina diso: Manomboka ihany koa ny interface interface dev, mivantana mankany amin'ny tabilao Console izay mampiseho diso, fampitandremana, ary data hafa azo aleha.
   Asehoy ny loharanom-pejy: Manokatra ny takelaka Resources , izay mampiseho ny loharanon-drakitra ho an'ny pejy mavitrika voasokajy amin'ny rakitra.
   Asehoy ireo loharanom-pejy ireo: Manatanteraka io asa io toy ny safidy Page Source .
   Asehoy ny fanontana Snippet: Manokatra varavarankely iray vaovao ahafahanao miditra amin'ny CSS sy HTML code, manamarina ny vokatra ao amin'ny-fly.
   Asehoy an-tsoroka ny mpilalao: Manampy ny manamboatra na manova ny Fitaovana Safari amin'ny CSS, HTML, ary JavaScript.
   Asehoy ny horonan-tsarimihetsika: Manokatra ny takelaka Timelines ary manomboka mampiseho ny fangatahan'ny tambajotra, ny fampisehoana ary ny fampisehoana ary ny famonoana JavaScript amin'ny fotoana mahamety azy.
   Lefy Cache : Mamafa ny cache manontolo izay misy ankehitriny ao anaty fiara sarotra.
   Mialà amin'ny alàlan'ny cache: Ajanony ny safari tsy hikirakira ka ny votoaty rehetra dia hivoaka avy amin'ny seriver amin'ny pejy isaky ny pejy.
   Hanafoana sary: Manakana sary tsy handefasana amin'ny tranonkala rehetra.
   Styles tsy manaiky: Tsy miraharaha ny properties CSS rehefa misy pejy entina.
   Alefaso JavaScript: Manakana ny famonoana JavaScript eo amin'ny pejy rehetra.
   Atsaharo ny fanitarana: Manakana ny fanitarana rehetra tsy voafehy amin'ny fakana navigateur.
   Hanafy ireo hack an'ny faritra: Raha toa ka novana ny Safari mba hifehezana ny adiresy manokana amin'ny pejy web active, dia hanakana izany fiovana izany ny safidy mba ho entin'ny pejy miakatra alohan'ny hidirana.
   Sasao ny famerana ny rakitra ao an-toerana: Azonao atao ny manana fidirana amin'ny rakitra eo amin'ny lahatahiryo eo an-toerana, hetsika iray voafetra amin'ny paikady noho ny antony fiarovana.
   Esory ny fametrahana ny fivoahana avy any ivelany: Ireo fepetra ireo dia napetraka amin'ny alàlan'ny fanamarinana mba hisorohana ny XSS sy ireo loza mety hitranga hafa. Na izany aza, dia matetika izy ireo no mila miala kilema amin'ny tanjona fampandrosoana.
   Alefaso ny JavaScript avy amin'ny Smart Search Field: Raha alefa, dia manome ny fahafahana miditra URL miaraka amin'ny javascript: nampidirina mivantana ao amin'ny adiresy bar.
   Manaova fanamarinana SHA-1 ho tsy azo antoka: Ny mari-pankasitrahana SSL mampiasa algorithm SHA-1 dia heverina ho tsy dia lafo sy mora vidy.