జావాస్క్రిప్ట్‌లో అల్గోరిథం సామర్థ్యాన్ని అర్థం చేసుకోవడం మరియు ఆప్టిమైజ్ చేయడం ఎలా

జావాస్క్రిప్ట్‌లో అల్గోరిథం సామర్థ్యాన్ని అర్థం చేసుకోవడం మరియు ఆప్టిమైజ్ చేయడం ఎలా

నాకు తెలిసిన ఒక డెవలపర్ ఒకసారి ఒక పెర్ఫార్మెన్స్ బగ్‌ను "యాప్‌కు మూడ్ బాగోలేదు" అని వర్ణించారు. అది దాదాపు సరిగ్గానే అనిపించింది. సాంకేతికంగా పేజీ లోడ్ అయ్యింది. బటన్లు చాలా వరకు పనిచేశాయి. కానీ కస్టమర్ ఆర్డర్ హిస్టరీ స్క్రీన్‌ను తెరిచిన ప్రతిసారీ, అంతా స్తంభించిపోయింది. స్క్రోల్ చేయాలి, ఆగాలి. క్లిక్ చేయాలి, ఆగాలి. సెర్చ్ బాక్స్‌లో టైప్ చేస్తే, ఉత్తరాలు మెయిల్‌లో వస్తున్నట్టుగా కనిపించాలి.

ఇది కూడా ఏదో భారీ ఎంటర్‌ప్రైజ్ తరహా యాప్ కాదు. ఒక చిన్న ఆపరేషన్స్ టీమ్ కోసం తయారు చేసిన మామూలు జావాస్క్రిప్ట్ వెబ్ యాప్. ఎడమవైపు ఆర్డర్లు, కుడివైపు వివరాలు, పైన ఫిల్టర్లు. ఇలాంటివి మొదట్లో సరళంగా మొదలై, రెండు సంవత్సరాలలో క్రమంగా సంక్లిష్టంగా మారిపోతాయి. ఇంకో డ్రాప్‌డౌన్. ఇంకో బ్యాడ్జ్. "మనం ఈ ఫీల్డ్‌ను కూడా చూపించగలమా?" అని ఇంకో ప్రశ్న. ఆపై ఒక మంగళవారం ఉదయం, ఎవరో, "ఇప్పుడు ఇది ఎందుకు ఇంత నెమ్మదిగా ఉంది?" అని అడుగుతారు.

మొదటి అనుమానం నెట్‌వర్క్ గురించే. ఎప్పుడూ అదే ఉంటుంది. ఏపీఐ నెమ్మదిగా ఉండి ఉంటుంది, కదా? కానీ ఏపీఐ ప్రతిస్పందన సుమారు 280 మిల్లీసెకన్లలో వచ్చింది. అద్భుతమేమీ కాదు, మరీ దారుణం కూడా కాదు. డేటా వచ్చిన తర్వాత కూడా పేజీ నాలుగు లేదా ఐదు సెకన్ల పాటు స్తంభించిపోయింది. బ్రౌజర్ ఏమీ ఆలోచించకుండా నిశ్శబ్దంగా కూర్చొని పనిచేసే ఆ విరామమే అసలైన ఆధారం.

నెమ్మదిగా సాగిన భాగాన్ని అందరూ నిందించలేదు

వారు బ్రౌజర్ పనితీరు సాధనాలను తెరిచి ఒక సెషన్‌ను రికార్డ్ చేశారు. అందులో పెద్దగా ఏమీ లేదు. రికార్డ్ క్లిక్ చేయడం, పేజీని రీలోడ్ చేయడం, ఆ దారుణమైన ప్రదర్శన ముగిసినప్పుడు ఆపేయడం. ఆ ఫ్లేమ్ చార్ట్, భూకంపం తర్వాత నగర దృశ్యంలా కనిపించింది. భారీ మొత్తంలో స్క్రిప్టింగ్ సమయం, చాలాసార్లు లేఅవుట్‌ను తిరిగి లెక్కించడం, మరియు సెర్చ్ బాక్స్ మారిన ప్రతిసారీ అనుమానాస్పద స్థాయిలో పని జరగడం వంటివి చోటుచేసుకున్నాయి.

ఆ యాప్ ఆర్డర్ల జాబితాను తీసుకుని, కస్టమర్ డేటాను జోడించి, తేదీలను ఫార్మాట్ చేసి, మొత్తాలను లెక్కించి, డిస్‌ప్లే లేబుల్‌లను సృష్టించి, క్రమబద్ధీకరించి, ఫిల్టర్ చేసి, ఆపై వందలాది వరుసలను రెండర్ చేస్తోంది. ఒక్కసారి కాదు. పదే పదే. సెర్చ్ ఇన్‌పుట్‌లో ఒక కీ నొక్కితే చాలు, ఈ తతంగమంతా మళ్లీ మొదలవుతుంది. ఇంకా విచిత్రం ఏమిటంటే, కొన్ని ఫార్మాటింగ్ ఫంక్షన్‌లు అప్పటికే నిర్మించిన ఆబ్జెక్ట్‌లను మళ్లీ నిర్మిస్తున్నాయి, ఎందుకంటే ఆ విధంగా కోడ్ "శుభ్రంగా" ఉంటుందని వారు భావించారు. శుభ్రంగానే ఉంది, నిజమే. కానీ అలసిపోయేలా కూడా ఉంది.

ఇక్కడే జావాస్క్రిప్ట్ పనితీరు గమ్మత్తుగా తయారవుతుంది. సమస్య తరచుగా దుష్ట స్వభావం గల ఒకే ఒక్క కోడ్ లైన్ కాదు. అది అమాయకంగా కనిపించే ముప్పై లైన్లు, వాటిలో ప్రతి ఒక్కటీ ఒక సహేతుకమైన చిన్న పనిని చేస్తూ, ఎవరూ ఊహించనంత తరచుగా పునరావృతమవుతాయి.

నిజమైన వినియోగదారులు నిజమైన డేటాను తీసుకువస్తారు, మరియు నిజమైన డేటా మొరటుగా ఉంటుంది

డెవలపర్ ల్యాప్‌టాప్‌లో, ఆర్డర్ హిస్టరీ స్క్రీన్‌లో బహుశా 50 నకిలీ రికార్డులు ఉండేవి. అంతా తక్షణమే జరిగినట్లు అనిపించింది. ప్రొడక్షన్‌లో, ఒక కస్టమర్‌కు 18,000 పాత ఆర్డర్లు ఉన్నాయి. మరొకరికి వింతగా పొడవైన ప్రొడక్ట్ పేర్లు, లేని ఫీల్డ్‌లు, పాత రద్దు చేయబడిన ఆర్డర్లు, మరియు ఎవరో సగం ఈమెయిల్ థ్రెడ్‌ను పేస్ట్ చేసినట్లు కనిపించే కస్టమర్ నోట్స్ ఉన్నాయి. టెస్ట్ డేటా సరిగ్గా ప్రవర్తిస్తుంది. ప్రొడక్షన్ డేటా చిరుతిళ్లు తెచ్చి రాత్రంతా ఉండిపోతుంది.

జావాస్క్రిప్ట్ పనిలో ఎదురయ్యే అత్యంత సాధారణ పనితీరు సమస్యలలో ఆ అంతరం ఒకటి. ఒక ఫీచర్‌ను చిన్న, చక్కని ఉదాహరణల ఆధారంగా నిర్మిస్తారు. ఆ తర్వాత, సంవత్సరాల తరబడి రికార్డులతో లేదా 43 ఎక్స్‌టెన్షన్‌లు ఇన్‌స్టాల్ చేయబడిన ఆఫీస్ మెషీన్ బ్రౌజర్‌తో నిజమైన వినియోగదారులు వస్తారు. అకస్మాత్తుగా, తేలికగా అనిపించిన పేజీ నేలపై ఫర్నిచర్‌ను ఈడ్చుకుంటూ వెళ్తున్నట్లు అనిపిస్తుంది.

ఈ పరిష్కారం గొప్పదేమీ కాదు. వారు కొన్ని సాధారణ పనులు చేశారు, సాధారణంగా అత్యుత్తమ పనితీరు ఇక్కడే విజయం సాధిస్తుంది. వారు ప్రతి రెండర్‌లో డెరైవ్డ్ ఫీల్డ్‌లను తిరిగి లెక్కించడం ఆపేశారు. వినియోగదారు టైప్ చేయడం ఆపే వరకు సెర్చ్‌ను ఆలస్యం చేశారు. ఒకేసారి తక్కువ వరుసలను రెండర్ చేశారు. అర్రేలను పదేపదే స్కాన్ చేయడానికి బదులుగా, ఖరీదైన కొన్ని లుకప్‌లను మ్యాప్‌లలోకి మార్చారు. ఇంకా, జావాస్క్రిప్ట్ DOM ఎలిమెంట్లను కొలిచి, స్టైల్స్‌ను మార్చి, మళ్లీ కొలిచే ఒక లేఅవుట్ ప్యాటర్న్‌ను తొలగించారు. ఈ ప్యాటర్న్ వల్ల, ఎవరో ఒకరు సూట్‌కేస్‌ను విప్పుతుండగా, ఒక వ్యక్తి దాన్ని సర్దడానికి ప్రయత్నించినట్లుగా బ్రౌజర్ రీడూ పని చేసేది.

తిరిగి రాయడం లేదు. ఫ్రేమ్‌వర్క్ మార్చడం లేదు. "మేము మూడు వారాల్లో ఫ్రంటెండ్‌ను పునర్నిర్మించాము" అనే ఆర్భాటపు ప్రసంగాలు లేవు. సమయం వాస్తవంగా ఎక్కడికి వెళుతుందో గమనించడం మాత్రమే.

ఫ్రేమ్‌వర్క్‌ను నిందించే ముందు ఏమి తనిఖీ చేయాలి

ఫ్రేమ్‌వర్క్‌లపై త్వరగా ఆరోపణలు వస్తుంటాయి. రియాక్ట్ నెమ్మదిగా ఉంది. వ్యూ నెమ్మదిగా ఉంది. బ్రౌజర్ నెమ్మదిగా ఉంది. నోడ్ నెమ్మదిగా ఉంది. కొన్నిసార్లు, ఒక నిర్దిష్ట కోణంలో ఇది నిజమే అయినా, సాధారణంగా ఉపయోగపడనంత అస్పష్టంగా ఉంటుంది. ఒక సాధనాన్ని నిందించే ముందు, దాని నుండి ఆశించే పనిని తనిఖీ చేయడం మంచిది.

• ముందుగా కొలవండి. బ్రౌజర్ డెవ్‌టూల్స్, నోడ్ ప్రొఫైలింగ్, అనుమానాస్పద కోడ్ చుట్టూ ఉండే సాధారణ టైమ్‌స్టాంప్‌లు, వాస్తవాలకు మిమ్మల్ని దగ్గర చేసేది ఏదైనా సరే. ఊహించడం సరదాగా ఉంటుంది, కానీ అది అబద్ధం చెబుతుంది.
• కేవలం వ్యవధిని మాత్రమే కాకుండా, తరచుదనాన్ని కూడా చూడండి. 2 మిల్లీసెకన్లు తీసుకునే ఫంక్షన్ కూడా, ప్రతి క్లిక్ తర్వాత 2,000 సార్లు నడిస్తే హాని కలిగించగలదు.
• ప్రొడక్షన్-ఆకారపు డేటాను ఉపయోగించండి. స్పష్టంగా, అజాగ్రత్తగా కాపీ చేసిన ప్రొడక్షన్ డేటా కాదు, కానీ వాస్తవిక పరిమాణం మరియు గజిబిజి నిర్మాణం ఉన్నది. పెద్ద జాబితాలు, నల్స్, పొడవైన స్ట్రింగ్‌లు, డూప్లికేట్ రికార్డులు, వినియోగదారుల వద్ద వాస్తవంగా ఉండే అన్ని విషయాలు.
• మెయిన్ థ్రెడ్‌ను గమనిస్తూ ఉండండి. బ్రౌజర్‌లో, జావాస్క్రిప్ట్, రెండరింగ్, లేఅవుట్ మరియు యూజర్ ఇన్‌పుట్ తరచుగా ప్రాధాన్యత కోసం పోటీపడతాయి. ఒకవేళ మెయిన్ థ్రెడ్ బిజీగా ఉంటే, కోడ్ "పనిచేస్తున్నప్పటికీ" పేజీ స్తంభించిపోయినట్లు అనిపిస్తుంది.
• క్లయింట్ పని నుండి నెట్‌వర్క్ సమయాన్ని వేరు చేయండి. వేగవంతమైన API ఉన్నంత మాత్రాన పేజీ కూడా వేగంగా ఉంటుందని హామీ లేదు. పార్సింగ్, రూపాంతరం చెందించడం, క్రమబద్ధీకరించడం మరియు రెండరింగ్ చేయడం అనేవి ఖర్చుతో కూడుకున్న పనులు కావచ్చు.

జావాస్క్రిప్ట్‌ను దాని వాస్తవ పరిమాణం కంటే భారంగా అనిపించేలా చేసే సాధారణ తప్పులు

ప్రతి కాంపోనెంట్ స్వతంత్రంగా ఉండాలని కోరుకోవడం వల్ల, ఒకే పనిని అనేక చోట్ల చేయడం ఒక పెద్ద పొరపాటు. ఐదు కాంపోనెంట్లు అన్నీ ఒకే తేదీ స్ట్రింగ్‌ను పార్స్ చేసినప్పుడు లేదా ఒకే జాబితాలో వెతికినప్పుడు తప్ప, ఇది వినడానికి చక్కగానే అనిపిస్తుంది. మరొకటి, రెండర్ పాత్‌ల లోపల సార్టింగ్ లేదా ఫిల్టరింగ్ చేయడం, ఇక్కడ స్టేట్ మారినప్పుడల్లా అది నిశ్శబ్దంగా మళ్లీ రన్ అవుతుంది. 20 ఐటమ్స్ వరకు ఇది ఫర్వాలేదు. కానీ 20,000 ఐటమ్స్ ఉంటే, ఇది అంత బాగుండదు.

ఇంకొక మోసపూరితమైనది: సమస్య యొక్క ఆకృతి గురించి ఆలోచించకుండా అర్రే మెథడ్స్‌ను ఉపయోగించడం. map , filter , reduce , మరియు find వంటి మెథడ్స్ చదవడానికి సులభంగా ఉంటాయి, మరియు సులభంగా ఉండటం మంచిదే, కానీ వాటిని పెద్ద అర్రేలపై వరుసగా ఉపయోగించడం వల్ల డేటాలో చాలాసార్లు పూర్తిగా ప్రాసెస్ చేయాల్సి రావచ్చు. కొన్నిసార్లు అది ఫర్వాలేదు. కొన్నిసార్లు దానివల్ల ఒకే గదిలో అటూ ఇటూ అదనంగా తిరగాల్సి వస్తుంది.

DOM పని అనేది మరో పెద్ద గందరగోళం. లేఅవుట్ విలువలను చదవడం, స్టైల్స్‌ను మార్చడం, ఎలిమెంట్లను జోడించడం, ఆపై మళ్లీ లేఅవుట్‌ను చదవడం వంటివి పదేపదే రీకాల్క్యులేషన్‌కు దారితీయవచ్చు. ప్రతి లైన్ చిన్నదిగా ఉండటం వల్ల కోడ్ ప్రమాదరహితంగా కనిపిస్తుంది. కానీ బ్రౌజర్ దాన్ని కాగితపు పనిలా చూస్తుంది. చాలా కాగితపు పనిలా.

ఇక లాగింగ్ విషయం. ప్రజలు లాగింగ్‌ను మర్చిపోతారు. ఒక లూప్‌లో కొన్ని కన్సోల్ స్టేట్‌మెంట్లు పెట్టడం, లేదా ఎక్కువ డేటా ఉన్న స్క్రీన్‌పై వెర్బోస్ డీబగ్ అవుట్‌పుట్‌ను ఆన్ చేసి ఉంచడం వంటివి, ముఖ్యంగా డెవలప్‌మెంట్ సమయంలో పనులను చాలా నెమ్మదిగా సాగేలా చేస్తాయి. ఇది చాలా ఇబ్బందికరమైన విషయం, బహుశా అందుకే ప్రతి ఒక్కరూ జీవితంలో ఒక్కసారైనా ఇలా చేసి, ఆ తర్వాత తాము "ఏదో చెక్ చేస్తున్నట్లు" నటించి ఉంటారు.

తరువాత బాధను నివారించే ఆచరణాత్మక అలవాట్లు

ముఖ్యమైన స్క్రీన్‌ల కోసం సుమారుగా ఒక పనితీరు బడ్జెట్‌ను నిర్దేశించండి. అది ఏ కార్పొరేట్ లాంఛనమూ కాకూడదు, కేవలం అందరికీ అర్థమయ్యే ఒక సంఖ్య చాలు. ఒక మధ్యశ్రేణి ల్యాప్‌టాప్‌లో ఆర్డర్ పేజీ సహేతుకమైన సమయంలో ఇంటరాక్టివ్‌గా మారాలి. సెర్చ్ చేస్తున్నప్పుడు టైపింగ్ స్తంభించిపోకూడదు. 10,000 రికార్డులు ఉన్న జాబితా కూడా ఉపయోగపడాలి, లేదా అది ఒకేసారి 10,000 రికార్డులను రెండర్ చేయడానికి ప్రయత్నించకూడదు. అస్పష్టమైన ఆశల కన్నా స్పష్టమైన భాష మేలు.

సాధ్యమైనంత వరకు ఖరీదైన ట్రాన్స్‌ఫార్మేషన్‌లను డేటా లేయర్‌కు దగ్గరగా ఉంచండి. ఐదు వ్యూస్‌కు ఒకే ప్రిపేర్డ్ స్ట్రక్చర్ అవసరమైతే, దానిని ఒకేసారి ప్రిపేర్ చేయండి. ఒకవేళ లుకప్ నిరంతరం జరుగుతుంటే, ఒక అర్రేను పదేపదే స్కాన్ చేయడం కంటే, ID ద్వారా కీ చేయబడిన మ్యాప్ లేదా ఆబ్జెక్ట్ మరింత సముచితంగా ఉంటుందో లేదో పరిగణించండి. డేటాపై లూప్ చేసే కోడ్‌ను సమీక్షించేటప్పుడు, జావాస్క్రిప్ట్ బిగ్ O నొటేషన్ అనలైజర్ వంటి సాధనం త్వరితగతిన రెండవ కన్నులా పనిచేస్తుంది, ప్రత్యేకించి ఒక చిన్న లూప్ మరొక చిన్న లూప్‌లో దాగి ఉన్నప్పుడు.

అలాగే, అప్పుడప్పుడు థ్రాట్లింగ్‌తో కూడా పరీక్షించండి. బ్రౌజర్ టూల్స్‌లోని స్లో CPU మోడ్ ఒక గట్టి పరీక్ష పెడుతుంది. అలాగే, ఒక చవకైన ఫోన్‌లో లేదా పాత ఆఫీస్ డెస్క్‌టాప్‌లో యాప్‌ను ప్రయత్నించడం కూడా. డెవలపర్లు సాధారణంగా శక్తివంతమైన మెషీన్‌లను, క్లీన్ బ్రౌజర్‌లను ఉపయోగిస్తారు, ఆ తర్వాత వినియోగదారులు ఎందుకు ఫిర్యాదు చేస్తున్నారని ఆశ్చర్యపోతారు. వినియోగదారులు మీ యాప్‌ను ఏదో మ్యూజియం ప్రదర్శన పెట్టెలో పెట్టి నడపడం లేదు. వారి వద్ద స్లాక్ తెరిచి ఉంటుంది, పన్నెండు ట్యాబ్‌లు ఉంటాయి, యాంటీవైరస్ స్కాన్ ఉంటుంది, ఇంకా ఇన్‌ఫ్రాస్ట్రక్చర్‌గా పరిగణించదగినంత పెద్ద స్ప్రెడ్‌షీట్ కూడా ఉంటుంది.

విసుగు పుట్టించే ముగింపే ఉపయోగకరమైన భాగం.

సరిదిద్దిన తర్వాత, ఆ ఆర్డర్ హిస్టరీ పేజీ అద్భుతంగా ఏమీ మారలేదు. అది కేవలం ప్రజలను విసిగించడం ఆపేసింది. సెర్చ్ సాధారణంగా అనిపించింది. స్క్రోలింగ్ సరిగ్గా పనిచేసింది. ఆపరేషన్స్ టీమ్ సమావేశాలలో దాని గురించి ప్రస్తావించడం మానేసింది, సాధారణంగా బిజినెస్ సాఫ్ట్‌వేర్‌కు లభించే అత్యున్నత ప్రశంస అదే.

ఆ రకమైన బగ్ నుండి నేర్చుకోవాల్సిన పాఠం సరళమైనదే కానీ మరచిపోవడం తేలిక: జావాస్క్రిప్ట్ పనితీరు అనేది అరుదుగా తెలివైన ట్రిక్కులను ప్రదర్శించడం గురించి ఉంటుంది. అది పునరావృతమయ్యే పనిని గమనించడం, డేటా పరిమాణాన్ని గౌరవించడం, మరియు బ్రౌజర్ మీ ఫంక్షన్‌లను అమలు చేయడం కంటే ఎక్కువే చేస్తుందని గుర్తుంచుకోవడం గురించి ఉంటుంది. నెమ్మదిగా ఉన్న భాగాన్ని కొలవండి. డేటాను వాస్తవికంగా చేయండి. మీకు కనిపించే వృధాను సరిచేయండి. ఆ తర్వాత మళ్ళీ కొలవండి, ఎందుకంటే కొన్నిసార్లు మీరు ముఖ్యమని ఖచ్చితంగా అనుకున్న విషయం ముఖ్యం కాకపోవచ్చు, మరియు ఆ చిన్న, విసుగు పుట్టించే విషయమే మొదటి నుండి అసలు సమస్య అయి ఉండవచ్చు.