ପ୍ରାୟ 15 ବର୍ଷ ପୂର୍ବେ, ମୁଁ ଏକ କମ୍ପାନୀରେ କାମ କରୁଥିଲି ଯେଉଁଠାରେ ଆମେ ଟ୍ରାଭେଲ ଏଜେଣ୍ଟ, ବିମାନବନ୍ଦର କର୍ମଚାରୀ ଏବଂ ବିମାନ କମ୍ପାନୀ ପାଇଁ ଆପ୍ ନିର୍ମାଣ କରିଥିଲୁ | UI ଉପାଦାନ ଏବଂ ଏକକ-ପୃଷ୍ଠା ଆପ୍ କ୍ଷମତା ପାଇଁ ଆମେ ମଧ୍ୟ ଆମର ନିଜସ୍ୱ ଘର framework ାଞ୍ଚା ନିର୍ମାଣ କରିଛୁ | ଆମର ସବୁକିଛି ପାଇଁ ଉପାଦାନ ଥିଲା: ଫିଲ୍ଡ, ବଟନ୍, ଟ୍ୟାବ୍, ରେଞ୍ଜ, ଡାଟାବେସ୍, ମେନୁ, ଡେଟପିକର୍, ସିଲେକ୍ଟ, ଏବଂ ମଲ୍ଟିସେଲେକ୍ଟ | ଆମର ଏକ ଡିଭ୍ ଉପାଦାନ ମଧ୍ୟ ଥିଲା | ଆମର ଡିଭ୍ ଉପାଦାନଟି ବହୁତ ଭଲ ଥିଲା, ଏହା ଆମକୁ ସମସ୍ତ ବ୍ରାଉଜରରେ ଗୋଲାକାର କୋଣ କରିବାକୁ ଅନୁମତି ଦେଲା, ଯାହା ବିଶ୍ believe ାସ କରେ ବା ନକର, ସେହି ସମୟରେ କରିବା ସହଜ ନୁହେଁ |
ଆମର କାର୍ଯ୍ୟ ଆମ ଇତିହାସର ଏକ ସମୟରେ ଘଟିଥିଲା ଯେତେବେଳେ JS, Ajax, ଏବଂ ଗତିଶୀଳ HTML ଏକ ବିପ୍ଳବ ଭାବରେ ଦେଖାଯାଉଥିଲା ଯାହା ଆମକୁ ଭବିଷ୍ୟତକୁ ଆଣିଥିଲା | ହଠାତ୍, ଆମେ ଏକ ପୃଷ୍ଠାକୁ ଗତିଶୀଳ ଭାବରେ ଅପଡେଟ୍ କରିପାରିବା, ଏକ ସର୍ଭରରୁ ତଥ୍ୟ ପାଇପାରିବା ଏବଂ ଅନ୍ୟ ପୃଷ୍ଠାଗୁଡ଼ିକୁ ନେଭିଗେଟ୍ କରିବାକୁ ଏଡ଼ାଇ ପାରିବା, ଯାହା ଧୀର ଭାବରେ ଦେଖାଯାଉଥିଲା ଏବଂ ଦୁଇଟି ପୃଷ୍ଠା ମଧ୍ୟରେ ପରଦାରେ ଏକ ବଡ଼ ଧଳା ଆୟତକ୍ଷେତ୍ର ଫ୍ଲାଶ୍ ହୋଇଥିଲା | ଜେଫ୍ ଆଟଉଡ୍ (ଷ୍ଟାକ ଓଭରଫ୍ଲୋର ପ୍ରତିଷ୍ଠାତା) ଦ୍ୱାରା ଲୋକପ୍ରିୟ ହୋଇଥିବା ଏକ ବାକ୍ୟାଂଶ ଥିଲା, ଯାହା ପ read ିଥିଲା: “ଯେକ Any ଣସି ପ୍ରୟୋଗ ଯାହା ଜାଭାସ୍କ୍ରିପ୍ଟରେ ଲେଖାଯାଇପାରିବ ଶେଷରେ ଜାଭାସ୍କ୍ରିପ୍ଟରେ ଲେଖାଯିବ |” - ଜେଫ୍ ଆଟଉଡ୍ |
ସେହି ସମୟରେ ଆମ ପାଇଁ, ଏହା ପ୍ରକୃତରେ ଯାଇ ସେହି ଆପ୍ସ ସୃଷ୍ଟି କରିବାକୁ ସାହସ ଭଳି ଲାଗିଲା | JS ସହିତ ସବୁକିଛି କରିବାକୁ ଏହା ଏକ କମ୍ବଳ ଅନୁମୋଦନ ପରି ଅନୁଭବ କଲା | ତେଣୁ ଆମେ JS ସହିତ ସବୁକିଛି କରିଥିଲୁ, ଏବଂ ଆମେ ପ୍ରକୃତରେ କାର୍ଯ୍ୟ କରିବାର ଅନ୍ୟ ଉପାୟ ଗବେଷଣା କରିବାକୁ ସମୟ ନେଇନାହୁଁ | HTML ଏବଂ CSS କ’ଣ କରିପାରିବ ତାହା ସଠିକ୍ ଭାବରେ ଜାଣିବା ପାଇଁ ଆମେ ପ୍ରକୃତରେ ଉତ୍ସାହ ଅନୁଭବ କରିନାହୁଁ | ଆମେ ପ୍ରକୃତରେ ୱେବକୁ ଏକ ବିକାଶଶୀଳ ଆପ୍ ପ୍ଲାଟଫର୍ମ ଭାବରେ ସମ୍ପୂର୍ଣ୍ଣ ରୂପେ ଅନୁଭବ କରିନାହୁଁ | ଆମେ ପ୍ରାୟତ something ଏହାକୁ କିଛି ଜିନିଷ ଭାବରେ ଦେଖୁଥିଲୁ ଯାହାକୁ ଆମେ ଚାରିଆଡ଼େ କାମ କରିବା ଆବଶ୍ୟକ କରୁ, ବିଶେଷକରି ଯେତେବେଳେ ଏହା ବ୍ରାଉଜର୍ ସମର୍ଥନକୁ ଆସିଲା | ଜିନିଷଗୁଡିକ ସରିବା ପାଇଁ ଆମେ ଏହା ଉପରେ ଅଧିକ JS ପକାଇ ପାରିବା | ୱେବ୍ କିପରି କାମ କଲା ଏବଂ ପ୍ଲାଟଫର୍ମରେ କ’ଣ ଉପଲବ୍ଧ ତାହା ବିଷୟରେ ଅଧିକ ଜାଣିବାକୁ ସମୟ ନେବେ କି? ନିଶ୍ଚିତ, ମୁଁ ବୋଧହୁଏ ଏକ ଗୁଣ୍ଡ କୋଡ୍ ସେଭ୍ କରିପାରେ ଯାହା ପ୍ରକୃତରେ ଆବଶ୍ୟକ ନଥିଲା | କିନ୍ତୁ, ସେହି ସମୟରେ, ବୋଧହୁଏ ସେତେ ଅଧିକ ନୁହେଁ | ଆପଣ ଦେଖିବେ, ସେତେବେଳେ ବ୍ରାଉଜର୍ ପାର୍ଥକ୍ୟ ବହୁତ ମହତ୍ୱପୂର୍ଣ୍ଣ ଥିଲା | ଏହା ଏକ ସମୟ ଥିଲା ଯେତେବେଳେ ଇଣ୍ଟରନେଟ୍ ଏକ୍ସପ୍ଲୋରର ପ୍ରାଧାନ୍ୟ ବ୍ରାଉଜର୍ ଥିଲା, ଫାୟାରଫକ୍ସ ଦ୍ second ିତୀୟରେ ରହିଥିଲା, କିନ୍ତୁ କ୍ରୋମ୍ ଶୀଘ୍ର ଲୋକପ୍ରିୟତା ହାସଲ କରିବା କାରଣରୁ ବଜାର ଅଂଶ ହରାଇବାକୁ ଲାଗିଲା | ଯଦିଓ କ୍ରୋମ ଏବଂ ଫାୟାରଫକ୍ସ ୱେବ୍ ଷ୍ଟାଣ୍ଡାର୍ଡରେ ସହମତ ହେବାରେ ବହୁତ ଭଲ ଥିଲା, ଯେଉଁ ପରିବେଶରେ ଆମର ଆପ୍ ଚାଲୁଥିଲା ଏହାର ଅର୍ଥ ହେଉଛି ଯେ ଆମକୁ ଦୀର୍ଘ ସମୟ ପାଇଁ IE6 କୁ ସମର୍ଥନ କରିବାକୁ ପଡିବ | ଏପରିକି ଯେତେବେଳେ ଆମକୁ IE8 କୁ ସମର୍ଥନ କରିବାକୁ ଅନୁମତି ଦିଆଗଲା, ତଥାପି ଆମକୁ ବ୍ରାଉଜର୍ ମଧ୍ୟରେ ଅନେକ ପାର୍ଥକ୍ୟର ସାମ୍ନା କରିବାକୁ ପଡିଲା | କେବଳ ସେତିକି ନୁହେଁ, ସେହି ସମୟର ୱେବରେ କେବଳ ପ୍ଲାଟଫର୍ମରେ ନିର୍ମିତ ଅନେକ ସାମର୍ଥ୍ୟ ନଥିଲା |
ଆଜି ଶୀଘ୍ର ଆଗକୁ ବ .ନ୍ତୁ | ଜିନିଷଗୁଡ଼ିକ ବହୁତ ବଦଳି ଯାଇଛି | ପୂର୍ବାପେକ୍ଷା ଆମର କେବଳ ଏହି ସାମର୍ଥ୍ୟଗୁଡିକ ଅଧିକ ନୁହେଁ, ବରଂ ସେମାନେ ଉପଲବ୍ଧ ହେବା ହାର ମଧ୍ୟ ବୃଦ୍ଧି ପାଇଛି | ମୋତେ ପୁନର୍ବାର ପ୍ରଶ୍ନ ପଚାରିବାକୁ ଦିଅ, ତା’ପରେ: ୱେବ୍ କିପରି କାମ କରେ ଏବଂ ପ୍ଲାଟଫର୍ମରେ କ’ଣ ଉପଲବ୍ଧ ତାହା ବିଷୟରେ ଅଧିକ ଜାଣିବା ପାଇଁ ସମୟ ନେବ କି? ଅବଶ୍ୟ ହଁ | ୱେବ୍ ପ୍ଲାଟଫର୍ମକୁ ବୁ understand ିବା ଏବଂ ବ୍ୟବହାର କରିବା ଶିଖିବା ଆଜି ଆପଣଙ୍କୁ ଅନ୍ୟ ବିକାଶକାରୀଙ୍କ ତୁଳନାରେ ଏକ ବଡ଼ ସୁବିଧା ଦେଇଥାଏ | ଆପଣ କାର୍ଯ୍ୟଦକ୍ଷତା, ଅଭିଗମ୍ୟତା, ପ୍ରତିକ୍ରିୟାଶୀଳତା ଉପରେ କାର୍ଯ୍ୟ କରନ୍ତୁ, ସମସ୍ତେ ଏକତ୍ର ହୁଅନ୍ତୁ, କିମ୍ବା କେବଳ UI ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ ପଠାଉଛନ୍ତି, ଯଦି ଆପଣ ଏହାକୁ ଏକ ଦାୟିତ୍ engineer ପୂର୍ଣ୍ଣ ଇଞ୍ଜିନିୟର ଭାବରେ କରିବାକୁ ଚାହାଁନ୍ତି, ଆପଣଙ୍କ ପାଇଁ ଉପଲବ୍ଧ ଉପକରଣଗୁଡିକ ଜାଣିବା ଆପଣଙ୍କ ଲକ୍ଷ୍ୟକୁ ଶୀଘ୍ର ଏବଂ ଉନ୍ନତ କରିବାରେ ସାହାଯ୍ୟ କରେ | କିଛି ଜିନିଷ ଯାହା ତୁମେ ଅନାମୋର ପାଇଁ ଲାଇବ୍ରେରୀ ଆବଶ୍ୟକ କରିପାରିବ ନାହିଁ | ଆଜି କେଉଁ ବ୍ରାଉଜର୍ ସମର୍ଥନ କରେ ଜାଣିବା, ତେବେ ପ୍ରଶ୍ନ ହେଉଛି: ଆମେ କ’ଣ ଖୋଳିବା? 2025 ରେ ଗୋଲାକାର କୋଣ କରିବା ପାଇଁ ଆମକୁ ଏକ ଡିଭ୍ ଉପାଦାନ ଦରକାର କି? ଅବଶ୍ୟ, ଆମେ କରୁନାହୁଁ | ଏହି ସମୟରେ 15 ବର୍ଷରୁ ଅଧିକ ସମୟ ପାଇଁ ସମସ୍ତ ବ୍ୟବହୃତ ବ୍ରାଉଜର୍ ଦ୍ୱାରା ସୀମା-ରେଡିଓ ପ୍ରପର୍ଟି ସମର୍ଥିତ | ଏବଂ କୋଣାର୍କ ଆକୃତି ମଧ୍ୟ ଖୁବ୍ ଶୀଘ୍ର ଆସୁଛି, ଏପରିକି ଫ୍ୟାନ୍ସର୍ କୋଣ ପାଇଁ | ଚାଲନ୍ତୁ ଅପେକ୍ଷାକୃତ ସାମ୍ପ୍ରତିକ ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ ଉପରେ ନଜର ପକାଇବା ଯାହା ବର୍ତ୍ତମାନ ସମସ୍ତ ପ୍ରମୁଖ ବ୍ରାଉଜର୍ରେ ଉପଲବ୍ଧ, ଏବଂ ଯାହାକୁ ଆପଣ ଆପଣଙ୍କର କୋଡବେସରେ ବିଦ୍ୟମାନ ନିର୍ଭରଶୀଳତାକୁ ବଦଳାଇବା ପାଇଁ ବ୍ୟବହାର କରିପାରିବେ | ବିଷୟଟି ତୁମର ସମସ୍ତ ପ୍ରିୟ ଲାଇବ୍ରେରୀଗୁଡ଼ିକୁ ତୁରନ୍ତ ଖୋଳିବା ଏବଂ ତୁମର କୋଡବେସ୍ ପୁନ r ଲିଖନ କରିବା ନୁହେଁ | ଅନ୍ୟ ସମସ୍ତ ବିଷୟ ପାଇଁ, ଆପଣଙ୍କୁ ପ୍ରଥମେ ବ୍ରାଉଜର୍ ସମର୍ଥନକୁ ଗ୍ରହଣ କରିବାକୁ ପଡିବ ଏବଂ ଆପଣଙ୍କ ପ୍ରୋଜେକ୍ଟ ପାଇଁ ନିର୍ଦ୍ଦିଷ୍ଟ ଅନ୍ୟାନ୍ୟ କାରଣ ଉପରେ ଆଧାର କରି ନିଷ୍ପତ୍ତି ନେବାକୁ ପଡିବ | ନିମ୍ନଲିଖିତ ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ ତିନୋଟି ମୁଖ୍ୟ ବ୍ରାଉଜର୍ ଇଞ୍ଜିନ୍ (କ୍ରୋମିୟମ୍, ୱେବ୍ କିଟ୍, ଏବଂ ଗେକୋ) ରେ କାର୍ଯ୍ୟକାରୀ ହୋଇଛି, କିନ୍ତୁ ଆପଣଙ୍କର ଭିନ୍ନ ଭିନ୍ନ ବ୍ରାଉଜର୍ ସମର୍ଥନ ଆବଶ୍ୟକତା ଥାଇପାରେ ଯାହା ଆପଣଙ୍କୁ ତୁରନ୍ତ ବ୍ୟବହାର କରିବାରେ ବାରଣ କରିବ | ଏହି ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ ବିଷୟରେ ଜାଣିବା ପାଇଁ ବର୍ତ୍ତମାନ ଏକ ଭଲ ସମୟ, ଯଦିଓ, ଏବଂ ବୋଧହୁଏ ସେଗୁଡିକୁ କିଛି ସମୟରେ ବ୍ୟବହାର କରିବାକୁ ଯୋଜନା କରନ୍ତୁ | ପପୋଭର ଏବଂ ସଂଳାପ | ପପୋଭର API,
ନିଶ୍ଚିତ, ଆପଣଙ୍କର ଇଣ୍ଟରନେଟ୍ ସଂଯୋଗ ଗତି ବୋଧହୁଏ ମଧ୍ୟ ବୃଦ୍ଧି ପାଇଛି, କିନ୍ତୁ ତାହା ସମସ୍ତଙ୍କ ପାଇଁ ନୁହେଁ | ଏବଂ ସମସ୍ତଙ୍କର ସମାନ ଉପକରଣ କ୍ଷମତା ମଧ୍ୟ ନାହିଁ | ପ୍ଲାଟଫର୍ମ ସହିତ ଆପଣ କରିଥିବା ଜିନିଷଗୁଡ଼ିକ ପାଇଁ ତୃତୀୟ-ପକ୍ଷ କୋଡ୍ ଟାଣିବା, ଏହା ପରିବର୍ତ୍ତେ, ସମ୍ଭବତ means ଆପଣ ଅଧିକ କୋଡ୍ ପଠାନ୍ତି, ଏବଂ ସେଥିପାଇଁ ଆପଣ ସାଧାରଣତ than ଅପେକ୍ଷା କମ୍ ଗ୍ରାହକଙ୍କ ନିକଟରେ ପହଞ୍ଚନ୍ତି | ୱେବରେ, ଖରାପ ଲୋଡିଂ କାର୍ଯ୍ୟଦକ୍ଷତା ବୃହତ ତ୍ୟାଗ ହାରକୁ ନେଇଥାଏ ଏବଂ ବ୍ରାଣ୍ଡର ପ୍ରତିଷ୍ଠାକୁ କ୍ଷତି ପହଞ୍ଚାଏ | ଉପକରଣଗୁଡ଼ିକରେ କମ୍ କୋଡ୍ ଚଲାଇବା | ଅଧିକନ୍ତୁ, ଆପଣ ଆପଣଙ୍କର ଗ୍ରାହକଙ୍କ ଡିଭାଇସରେ ପଠାଉଥିବା କୋଡ୍ ସମ୍ଭବତ faster ଶୀଘ୍ର ଚାଲିଥାଏ ଯଦି ଏହା ପ୍ଲାଟଫର୍ମର ଉପରେ କମ୍ ଜାଭାସ୍କ୍ରିପ୍ଟ ଅବଷ୍ଟ୍ରାକ୍ଟ ବ୍ୟବହାର କରେ | ଏହା ମଧ୍ୟ ବୋଧହୁଏ ଅଧିକ ପ୍ରତିକ୍ରିୟାଶୀଳ ଏବଂ ଡିଫଲ୍ଟ ଭାବରେ ଅଧିକ ଉପଲବ୍ଧ ଅଟେ | ଏହି ସବୁ ଅଧିକ ଏବଂ ଅଧିକ ଖୁସି ଗ୍ରାହକଙ୍କୁ ନେଇଥାଏ | ମୋର ସହକର୍ମୀ ଆଲେକ୍ସ ରସେଲଙ୍କ ବାର୍ଷିକ କାର୍ଯ୍ୟଦକ୍ଷତା ଅସମାନତା ଫାଙ୍କା ବ୍ଲଗ୍ ଯାଞ୍ଚ କରନ୍ତୁ, ଯାହା ଦର୍ଶାଏ ଯେ ଧନ ଅସମାନତା ହେତୁ କୋଟି କୋଟି ଉପଭୋକ୍ତା ସହିତ ପ୍ରିମିୟମ ଉପକରଣଗୁଡ଼ିକ ବଜାରରେ ଅନୁପସ୍ଥିତ | ଏବଂ ଏହି ବ୍ୟବଧାନ କେବଳ ସମୟ ସହିତ ବ growing ୁଛି |
ବିଲ୍ଟ-ଇନ୍ ମାନସ ଲେଆଉଟ୍ | ଗୋଟିଏ ୱେବ୍ ପ୍ଲାଟଫର୍ମ ବ feature ଶିଷ୍ଟ୍ୟ ଯାହା ଶୀଘ୍ର ଆସିବ ଏବଂ ଯାହା ବିଷୟରେ ମୁଁ ବହୁତ ଉତ୍ସାହିତ, ତାହା ହେଉଛି CSS ମାନସ |
ମ ason ସୁନି କ’ଣ ତାହା ବ୍ୟାଖ୍ୟା କରି ଆରମ୍ଭ କରିବା | ମାନସ କ’ଣ? ମ ason ସୁମୀ ହେଉଛି ଏକ ପ୍ରକାର ଲେଆଉଟ୍ ଯାହା ବର୍ଷ ବର୍ଷ ପୂର୍ବରୁ ପିନରେଷ୍ଟ ଦ୍ୱାରା ଲୋକପ୍ରିୟ ହୋଇଥିଲା | ଏହା ବିଷୟବସ୍ତୁର ସ୍ independent ାଧୀନ ଟ୍ରାକ୍ ସୃଷ୍ଟି କରେ ଯେଉଁଥିରେ ଆଇଟମଗୁଡିକ ନିଜକୁ ଟ୍ରାକ୍ ଆରମ୍ଭର ନିକଟତର ଭାବରେ ପ୍ୟାକ୍ କରନ୍ତି |
ଅନେକ ଲୋକ ପୋର୍ଟଫୋଲିଓ ଏବଂ ଫଟୋ ଗ୍ୟାଲେରୀ ପାଇଁ ମେସନ୍ରିକୁ ଏକ ଉତ୍ତମ ବିକଳ୍ପ ଭାବରେ ଦେଖନ୍ତି, ଯାହା ନିଶ୍ଚିତ ଭାବରେ କରିପାରେ | କିନ୍ତୁ ପିନେରେଷ୍ଟରେ ଆପଣ ଯାହା ଦେଖୁଛନ୍ତି ତାହା ଅପେକ୍ଷା ମାନସ ଅଧିକ ନମନୀୟ, ଏବଂ ଏହା କେବଳ ଜଳପ୍ରପାତ ପରି ଲେଆଉଟ୍ ମଧ୍ୟରେ ସୀମିତ ନୁହେଁ | ଏକ ମେସନ୍ରି ଲେଆଉଟ୍ ରେ:
ଟ୍ରାକଗୁଡିକ ସ୍ତମ୍ଭ କିମ୍ବା ଧାଡି ହୋଇପାରେ:
ବିଷୟବସ୍ତୁର ଟ୍ରାକଗୁଡିକ ସମାନ ଆକାରର ହେବା ଆବଶ୍ୟକ ନୁହେଁ:
ଆଇଟମ୍ ଗୁଡିକ ଏକାଧିକ ଟ୍ରାକ୍ ବିସ୍ତାର କରିପାରନ୍ତି:
ଆଇଟମଗୁଡିକ ନିର୍ଦ୍ଦିଷ୍ଟ ଟ୍ରାକରେ ରଖାଯାଇପାରିବ; ସେମାନଙ୍କୁ ସର୍ବଦା ସ୍ୱୟଂଚାଳିତ ସ୍ଥାନିତ ଆଲଗୋରିଦମ ଅନୁସରଣ କରିବାକୁ ପଡିବ ନାହିଁ:
ଡେମୋସ୍ | କ୍ରୋମିୟମରେ CSS ମାନସ୍ର ଆଗାମୀ କାର୍ଯ୍ୟକାରିତାକୁ ବ୍ୟବହାର କରି ମୁଁ ଏଠାରେ କିଛି ସରଳ ଡେମୋ ପ୍ରସ୍ତୁତ କରିଛି | ଏକ ଫଟୋ ଗ୍ୟାଲେରୀ ଡେମୋ, ଆଇଟମ୍ ଗୁଡିକ (ଏହି କ୍ଷେତ୍ରରେ ଆଖ୍ୟା) କିପରି ଏକାଧିକ ଟ୍ରାକ୍ ବିସ୍ତାର କରିପାରିବ ତାହା ଦର୍ଶାଉଛି:
ବିଭିନ୍ନ ଆକାରର ଟ୍ରାକ୍ ଦେଖାଉଥିବା ଅନ୍ୟ ଏକ ଫଟୋ ଗ୍ୟାଲେରୀ:
ଅନ୍ୟମାନଙ୍କ ତୁଳନାରେ କିଛି ଟ୍ରାକ୍ ସହିତ ଏକ ନ୍ୟୁଜ୍ ସାଇଟ୍ ଲେଆଉଟ୍, ଏବଂ ଲେଆଉଟ୍ ର ସମ୍ପୂର୍ଣ୍ଣ ଓସାରରେ କିଛି ଆଇଟମ୍:
ଏକ କାନବାନ୍ ବୋର୍ଡ ଦର୍ଶାଉଛି ଯେ ଆଇଟମଗୁଡିକ ନିର୍ଦ୍ଦିଷ୍ଟ ଟ୍ରାକରେ ରଖାଯାଇପାରିବ:
ଟିପନ୍ତୁ :।କ୍ରୋମିୟମର ଏକ ସଂସ୍କରଣ ସହିତ ପୂର୍ବ ଡେମୋ ତିଆରି କରାଯାଇଥିଲା ଯାହା ଏପର୍ଯ୍ୟନ୍ତ ଅଧିକାଂଶ ୱେବ୍ ବ୍ୟବହାରକାରୀଙ୍କ ପାଇଁ ଉପଲବ୍ଧ ନୁହେଁ, କାରଣ CSS ମାନସ କେବଳ ବ୍ରାଉଜରରେ କାର୍ଯ୍ୟକାରୀ ହେବାକୁ ଆରମ୍ଭ କରିଛି | ତଥାପି, ୱେବ୍ ଡେଭଲପର୍ମାନେ ଖୁସିରେ ଲାଇବ୍ରେରୀ ବ୍ୟବହାର କରି ବର୍ଷ ବର୍ଷ ଧରି ମେସନ୍ରି ଲେଆଉଟ୍ ସୃଷ୍ଟି କରୁଛନ୍ତି | ଆଜି ମାନସ ବ୍ୟବହାର କରୁଥିବା ସାଇଟଗୁଡିକ | ବାସ୍ତବରେ, ମେସନ୍ରି ଆଜି ୱେବରେ ବହୁତ ସାଧାରଣ ଅଟେ | Pinterest ବ୍ୟତୀତ ମୁଁ ଏଠାରେ କିଛି ଉଦାହରଣ ପାଇଲି:
ଏବଂ ଆଉ କିଛି, କମ୍ ସ୍ପଷ୍ଟ, ଉଦାହରଣ:
ତେବେ, ଏହି ଲେଆଉଟଗୁଡିକ କିପରି ସୃଷ୍ଟି ହେଲା? କାର୍ଯ୍ୟକ୍ଷେତ୍ର | ଗୋଟିଏ କ ick ଶଳ ଯାହା ମୁଁ ବ୍ୟବହୃତ ହୋଇଛି ତାହା ବଦଳରେ ଏକ ଫ୍ଲେକ୍ସବକ୍ସ ଲେଆଉଟ୍ ବ୍ୟବହାର କରିବା, ଏହାର ଦିଗକୁ ସ୍ତମ୍ଭରେ ପରିବର୍ତ୍ତନ କରିବା ଏବଂ ଏହାକୁ ଗୁଡ଼ାଇ ରଖିବା | ଏହି ଉପାୟରେ, ଆପଣ ବିଭିନ୍ନ ଉଚ୍ଚତାର ଆଇଟମଗୁଡିକ ଏକାଧିକ, ସ୍ independent ାଧୀନ ସ୍ତମ୍ଭରେ ରଖିପାରିବେ, ଏକ ମେସନ୍ରି ଲେଆଉଟ୍ ର ଭାବନା ପ୍ରଦାନ କରିବେ:
ଏହି କାର୍ଯ୍ୟକ୍ଷେତ୍ର ସହିତ, ଦୁଇଟି ସୀମା ଅଛି:
ଆଇଟମଗୁଡିକର କ୍ରମ ପ୍ରକୃତ ମେସନ୍ରି ଲେଆଉଟ୍ ସହିତ କ’ଣ ହେବ ତାହାଠାରୁ ଭିନ୍ନ | ଫ୍ଲେକ୍ସବକ୍ସ ସହିତ, ଆଇଟମଗୁଡିକ ପ୍ରଥମେ ପ୍ରଥମ ସ୍ତମ୍ଭ ପୂରଣ କରେ ଏବଂ ଯେତେବେଳେ ଏହା ପୂର୍ଣ୍ଣ ହୁଏ, ତା’ପରେ ପରବର୍ତ୍ତୀ ସ୍ତମ୍ଭକୁ ଯାଆନ୍ତୁ | ମ ason ସୁମୀ ସହିତ, ଆଇଟମଗୁଡିକ ଯେକ track ଣସି ଟ୍ରାକରେ (କିମ୍ବା ଏହି କ୍ଷେତ୍ରରେ ସ୍ତମ୍ଭ) ଅଧିକ ସ୍ଥାନ ଉପଲବ୍ଧ ହେବ | କିନ୍ତୁ, ଏବଂ ବୋଧହୁଏ ଅଧିକ ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ ହେଉଛି, ଏହି ୱାର୍କଆଉଟ୍ ଆବଶ୍ୟକ କରେ ଯେ ଆପଣ ଫ୍ଲେକ୍ସବକ୍ସ ପାତ୍ରରେ ଏକ ସ୍ଥିର ଉଚ୍ଚତା ସେଟ୍ କରନ୍ତୁ; ଅନ୍ୟଥା, କ wra ଣସି ରାପିଙ୍ଗ୍ ଘଟିବ ନାହିଁ |
ତୃତୀୟ-ପକ୍ଷ ମାନସ ଲାଇବ୍ରେରୀ | ଅଧିକ ଉନ୍ନତ ମାମଲା ପାଇଁ, ବିକାଶକାରୀମାନେ ଲାଇବ୍ରେରୀ ବ୍ୟବହାର କରୁଛନ୍ତି | ଏଥିପାଇଁ ସବୁଠାରୁ ଜଣାଶୁଣା ଏବଂ ଲୋକପ୍ରିୟ ଲାଇବ୍ରେରୀକୁ କେବଳ ମେସନ୍ରି କୁହାଯାଏ, ଏବଂ NPM ଅନୁଯାୟୀ ଏହା ସପ୍ତାହକୁ ପ୍ରାୟ 200,000 ଥର ଡାଉନଲୋଡ୍ ହୋଇଥାଏ | ସ୍କ୍ୱାର୍ ସ୍ପେସ୍ ଏକ ଲେଆଉଟ୍ ଉପାଦାନ ମଧ୍ୟ ପ୍ରଦାନ କରେ ଯାହା ଏକ ନୋ-କୋଡ୍ ବିକଳ୍ପ ପାଇଁ ଏକ ମେସନ୍ରି ଲେଆଉଟ୍ ପ୍ରଦାନ କରେ ଏବଂ ଅନେକ ସାଇଟ୍ ଏହାକୁ ବ୍ୟବହାର କରନ୍ତି | ଏହି ଦୁଇଟି ବିକଳ୍ପ ଲେଆଉଟ୍ ରେ ଆଇଟମ୍ ରଖିବା ପାଇଁ ଜାଭାସ୍କ୍ରିପ୍ଟ କୋଡ୍ ବ୍ୟବହାର କରେ | ବିଲ୍ଟ-ଇନ୍ ମାନସ | ମୁଁ ପ୍ରକୃତରେ ଉତ୍ସାହିତ ଯେ ମେସନ୍ରି ବର୍ତ୍ତମାନ ଏକ ବିଲ୍ଟ-ଇନ୍ CSS ବ feature ଶିଷ୍ଟ୍ୟ ଭାବରେ ବ୍ରାଉଜରରେ ଦେଖାଯିବା ଆରମ୍ଭ କରିଛି | ସମୟ ସହିତ, ଆପଣ ଗ୍ରୀଡ୍ କିମ୍ବା ଫ୍ଲେକ୍ସବକ୍ସ ଭଳି ମେସନ୍ରି ବ୍ୟବହାର କରିବାରେ ସକ୍ଷମ ହେବେ, ଅର୍ଥାତ୍ କ work ଣସି କାର୍ଯ୍ୟକ୍ଷେତ୍ର କିମ୍ବା ତୃତୀୟ-ପକ୍ଷ କୋଡ୍ ଆବଶ୍ୟକ ନକରି | ମାଇକ୍ରୋସଫ୍ଟରେ ମୋର ଟିମ୍ କ୍ରୋମିୟମ୍ ଓପନ୍ ସୋର୍ସ ପ୍ରୋଜେକ୍ଟରେ ବିଲ୍ଟ-ଇନ୍ ମେସେରି ସମର୍ଥନ ପ୍ରୟୋଗ କରିଆସୁଛି, ଯାହା ଏଜ୍, କ୍ରୋମ୍ ଏବଂ ଅନ୍ୟାନ୍ୟ ବ୍ରାଉଜର୍ ଉପରେ ଆଧାରିତ | ମୋଜିଲା ପ୍ରକୃତରେ ପ୍ରଥମ ବ୍ରାଉଜର୍ ବିକ୍ରେତା ଥିଲା ଯାହାକି 2020 ରେ ମେସନ୍ରିର ଏକ ପରୀକ୍ଷାମୂଳକ କାର୍ଯ୍ୟକାରିତା ପ୍ରସ୍ତାବ ଦେଇଥିଲା ଏବଂ ଆପଲ୍ ମଧ୍ୟ ଏହି ନୂତନ ୱେବ୍ ଲେଆଉଟ୍ ଆଦିମ ଘଟାଇବାକୁ ଆଗ୍ରହୀ ଥିଲା | ବ direction ଶିଷ୍ଟ୍ୟକୁ ମାନକ କରିବା ପାଇଁ କାର୍ଯ୍ୟ ମଧ୍ୟ ଆଗକୁ ବ, ୁଛି, CSS କାର୍ଯ୍ୟ ଗୋଷ୍ଠୀ ମଧ୍ୟରେ ସାଧାରଣ ଦିଗ ଏବଂ ଏକ ନୂତନ ପ୍ରଦର୍ଶନ ପ୍ରକାର ପ୍ରଦର୍ଶନ: ଗ୍ରୀଡ୍-ଗାଡ଼ି ବିଷୟରେ ଚୁକ୍ତିନାମା ସହିତ | ଯଦି ଆପଣ ମେସନ୍ରି ବିଷୟରେ ଅଧିକ ଜାଣିବାକୁ ଚାହାଁନ୍ତି ଏବଂ ପ୍ରଗତିକୁ ଟ୍ରାକ୍ କରନ୍ତି, ତେବେ ମୋର CSS ମାନସ ଉତ୍ସ ଉତ୍ସ ପୃଷ୍ଠା ଦେଖନ୍ତୁ | ସମୟ ସହିତ, ଯେତେବେଳେ ମେସନ୍ରି ଏକ ବେସ୍ ଲାଇନ୍ ବ feature ଶିଷ୍ଟ୍ୟ ହୋଇଯାଏ, ଠିକ୍ ଗ୍ରୀଡ୍ କିମ୍ବା ଫ୍ଲେକ୍ସବକ୍ସ ପରି, ଆମେ ଏହାକୁ କେବଳ ବ୍ୟବହାର କରିବାକୁ ସମର୍ଥ ହୋଇପାରିବା ଏବଂ ଏଥିରୁ ଉପକୃତ ହୋଇପାରିବା:
ଉତ୍ତମ ପ୍ରଦର୍ଶନ, ଉତ୍ତମ ପ୍ରତିକ୍ରିୟାଶୀଳତା, ବ୍ୟବହାରର ସହଜତା ଏବଂ ସରଳ କୋଡ୍ |
ଚାଲ ଏଗୁଡ଼ିକ ଉପରେ ଧ୍ୟାନ ଦେବା | ଉତ୍ତମ ପ୍ରଦର୍ଶନ ଆପଣଙ୍କର ନିଜସ୍ୱ ମେସେରି ପରି ଲେଆଉଟ୍ ସିଷ୍ଟମ୍ ତିଆରି କରିବା, କିମ୍ବା ଏହା ବଦଳରେ ଏକ ତୃତୀୟ-ପକ୍ଷ ଲାଇବ୍ରେରୀ ବ୍ୟବହାର କରିବା, ଅର୍ଥାତ୍ ସ୍କ୍ରିନରେ ଆଇଟମ୍ ରଖିବା ପାଇଁ ଆପଣଙ୍କୁ ଜାଭାସ୍କ୍ରିପ୍ଟ କୋଡ୍ ଚଲାଇବାକୁ ପଡିବ | ଏହାର ଅର୍ଥ ହେଉଛି ଏହି କୋଡ୍ ବ୍ଲକିଂ ରେଣ୍ଡର ହେବ | ବାସ୍ତବରେ, କିଛି ଦେଖାଯିବ ନାହିଁ, କିମ୍ବା ଜାଭାସ୍କ୍ରିପ୍ଟ କୋଡ୍ ଚାଲିବା ପର୍ଯ୍ୟନ୍ତ ଜିନିଷଗୁଡିକ ସଠିକ୍ ସ୍ଥାନରେ କିମ୍ବା ସଠିକ୍ ଆକାରରେ ରହିବ ନାହିଁ | ଏକ ୱେବ୍ ପୃଷ୍ଠାର ମୂଖ୍ୟ ଅଂଶ ପାଇଁ ମ ason ସୁମୀ ଲେଆଉଟ୍ ପ୍ରାୟତ used ବ୍ୟବହୃତ ହୁଏ, ଯାହାର ଅର୍ଥ ହେଉଛି ତୁମର LCP, କିମ୍ବା ସର୍ବ ବୃହତ ବିଷୟବସ୍ତୁ ପେଣ୍ଟ ମେଟ୍ରିକ୍କୁ ଖରାପ କରି, ତୁମର ମୂଖ୍ୟ ବିଷୟବସ୍ତୁକୁ ପରେ ଦେଖାଯିବ, ଯାହା ଅନୁଭବ ହୋଇଥିବା କାର୍ଯ୍ୟଦକ୍ଷତା ଏବଂ ସର୍ଚ୍ଚ ଇଞ୍ଜିନ୍ ଅପ୍ଟିମାଇଜେସନ୍ରେ ଏକ ପ୍ରମୁଖ ଭୂମିକା ଗ୍ରହଣ କରିଥାଏ | ମୁଁ ଏକ ସରଳ ଲେଆଉଟ୍ ସହିତ ଏବଂ DevTools ରେ ଏକ ଧୀର 4G ସଂଯୋଗକୁ ଅନୁକରଣ କରି ମେସନ୍ରି JS ଲାଇବ୍ରେରୀ ପରୀକ୍ଷା କଲି | ଲାଇବ୍ରେରୀଟି ବହୁତ ବଡ ନୁହେଁ (24KB, 7.8KB gzipped), କିନ୍ତୁ ମୋ ପରୀକ୍ଷା ଅବସ୍ଥାରେ ଲୋଡ୍ କରିବାକୁ 600 ମିଟର ସମୟ ଲାଗିଲା | ଏଠାରେ ଏକ କାର୍ଯ୍ୟଦକ୍ଷତା ରେକର୍ଡିଂ ଦର୍ଶାଉଛି ଯେ ମାସୋନି ଲାଇବ୍ରେରୀ ପାଇଁ ଲମ୍ବା 600 ମିଟର ଲୋଡ୍ ସମୟ, ଏବଂ ଏହା ଘଟୁଥିବାବେଳେ ଅନ୍ୟ କ render ଣସି ରେଣ୍ଡରିଂ କାର୍ଯ୍ୟକଳାପ ଘଟି ନଥିଲା:
ଏହା ସହିତ, ପ୍ରାରମ୍ଭିକ ଲୋଡ୍ ସମୟ ପରେ, ଡାଉନଲୋଡ୍ ହୋଇଥିବା ସ୍କ୍ରିପ୍ଟକୁ ବିଶ୍ଳେଷଣ, ସଂକଳନ ଏବଂ ତାପରେ ଚଲାଇବା ଆବଶ୍ୟକ | ଯାହା ସମସ୍ତ, ପୂର୍ବରୁ ଉଲ୍ଲେଖ କରାଯାଇଥିବା ପରି, ପୃଷ୍ଠାର ଅନୁବାଦକୁ ଅବରୋଧ କରୁଥିଲା | ବ୍ରାଉଜରରେ ଏକ ବିଲ୍ଟ-ଇନ୍ ମାନସ ପ୍ରୟୋଗ ସହିତ, ଲୋଡ୍ ଏବଂ ଚଲାଇବା ପାଇଁ ଆମର ସ୍କ୍ରିପ୍ଟ ନାହିଁ | ପ୍ରାରମ୍ଭିକ ପୃଷ୍ଠା ରେଣ୍ଡରିଂ ଷ୍ଟେପ୍ ସମୟରେ ବ୍ରାଉଜର୍ ଇଞ୍ଜିନ୍ କେବଳ ଏହାର କାର୍ଯ୍ୟ କରିବ | ଉତ୍ତମ ପ୍ରତିକ୍ରିୟାଶୀଳତା | ସେହିଭଳି ଯେତେବେଳେ ଏକ ପୃଷ୍ଠା ପ୍ରଥମେ ଲୋଡ୍ ହୁଏ, ବ୍ରାଉଜର୍ ୱିଣ୍ଡୋର ଆକାର ପରିବର୍ତ୍ତନ କରି ସେହି ପୃଷ୍ଠାରେ ଲେଆଉଟ୍ ପୁନର୍ବାର ଉପସ୍ଥାପନ କରେ | ଏହି ସମୟରେ, ଯଦିଓ, ପୃଷ୍ଠାଟି ମେସେରି JS ଲାଇବ୍ରେରୀ ବ୍ୟବହାର କରୁଛି, ସ୍କ୍ରିପ୍ଟ ଲୋଡ୍ କରିବାର କ there ଣସି ଆବଶ୍ୟକତା ନାହିଁ, କାରଣ ଏହା ପୂର୍ବରୁ |ଏଠାରେ ତଥାପି, କୋଡ୍ ଯାହା ଆଇଟମ୍ ଗୁଡିକ ସଠିକ୍ ସ୍ଥାନରେ ଘୁଞ୍ଚାଏ | ପେଜ୍ ଲୋଡ୍ ହେବାବେଳେ ବର୍ତ୍ତମାନ ଏହି ନିର୍ଦ୍ଦିଷ୍ଟ ଲାଇବ୍ରେରୀ ଏହା କରିବାରେ ଖୁବ୍ ଦ୍ରୁତ ମନେହୁଏ | ଅବଶ୍ୟ, ଏହା ଆଇଟମଗୁଡ଼ିକୁ ଆନିମେସନ୍ କରେ ଯେତେବେଳେ ସେମାନେ ୱିଣ୍ଡୋ ଆକାରର ଏକ ଭିନ୍ନ ସ୍ଥାନକୁ ଯିବା ଆବଶ୍ୟକ କରନ୍ତି, ଏବଂ ଏହା ଏକ ବଡ଼ ପରିବର୍ତ୍ତନ ଆଣେ | ଅବଶ୍ୟ, ଉପଭୋକ୍ତାମାନେ ସେମାନଙ୍କର ବ୍ରାଉଜର୍ ୱିଣ୍ଡୋଜର ଆକାର ପରିବର୍ତ୍ତନ କରିବାକୁ ସମୟ ଦିଅନ୍ତି ନାହିଁ ଯେତିକି ଆମେ ବିକାଶକାରୀମାନେ କରୁ | କିନ୍ତୁ ଏହି ଆନିମେଟେଡ୍ ରିଜାଇଜ୍ ଅଭିଜ୍ଞତା ସୁନ୍ଦର ଭାବରେ କ୍ଷତିକାରକ ହୋଇପାରେ ଏବଂ ପୃଷ୍ଠାଟି ଏହାର ନୂତନ ଆକାର ସହିତ ଖାପ ଖୁଆଇବା ପାଇଁ ଆବଶ୍ୟକ ସମୟକୁ ଯୋଗ କରିଥାଏ | ବ୍ୟବହାରର ସହଜତା ଏବଂ ସରଳ କୋଡ୍ | ଏକ ୱେବ୍ ବ feature ଶିଷ୍ଟ୍ୟ ବ୍ୟବହାର କରିବା କେତେ ସହଜ ଏବଂ କୋଡ୍ କେତେ ସରଳ ଦେଖାଯାଏ ତାହା ହେଉଛି ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ କାରଣ ଯାହା ଆପଣଙ୍କ ଦଳ ପାଇଁ ଏକ ବଡ଼ ପରିବର୍ତ୍ତନ ଆଣିପାରେ | ଅନ୍ତିମ ଉପଭୋକ୍ତା ଅଭିଜ୍ as ତା ପରି ସେମାନେ କେବେବି ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ ହୋଇପାରିବେ ନାହିଁ, କିନ୍ତୁ ବିକାଶକାରୀ ଅଭିଜ୍ maintain ତା ରକ୍ଷଣାବେକ୍ଷଣ ଉପରେ ପ୍ରଭାବ ପକାଇଥାଏ | ଏକ ବିଲ୍ଟ-ଇନ୍ ୱେବ୍ ବ feature ଶିଷ୍ଟ୍ୟ ବ୍ୟବହାର କରିବା ସେହି ସାମ୍ନାରେ ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ ଲାଭ ସହିତ ଆସେ:
ବିକାଶକାରୀମାନେ ଯେଉଁମାନେ ପୂର୍ବରୁ HTML, CSS, ଏବଂ JS ଜାଣନ୍ତି ସେହି ବ feature ଶିଷ୍ଟ୍ୟକୁ ସହଜରେ ବ୍ୟବହାର କରିବାରେ ସକ୍ଷମ ହେବେ କାରଣ ଏହା ଭଲ ଭାବରେ ଏକୀଭୂତ ହେବା ଏବଂ ବାକି ୱେବ୍ ପ୍ଲାଟଫର୍ମ ସହିତ ସୁସଙ୍ଗତ ହେବା ପାଇଁ ଡିଜାଇନ୍ ହୋଇଛି | ବ feature ଶିଷ୍ଟ୍ୟ କିପରି ବ୍ୟବହୃତ ହୁଏ ସେଥିରେ ପରିବର୍ତ୍ତନଗୁଡିକ ଭାଙ୍ଗିବାର କ risk ଣସି ବିପଦ ନାହିଁ | ସେହି ବ feature ଶିଷ୍ଟ୍ୟର ନାପସନ୍ଦ କିମ୍ବା ଅପରିଚିତ ହେବାର ପ୍ରାୟ ଶୂନ୍ୟ ବିପଦ ଅଛି |
ବିଲ୍ଟ-ଇନ୍ ମେସେରି କ୍ଷେତ୍ରରେ, କାରଣ ଏହା ଏକ ଲେଆଉଟ୍ ପ୍ରାଥମିକ, ଆପଣ ଏହାକୁ CSS ରୁ ବ୍ୟବହାର କରନ୍ତି, ଠିକ୍ ଗ୍ରୀଡ୍ କିମ୍ବା ଫ୍ଲେକ୍ସବକ୍ସ ପରି, କ J ଣସି JS ଜଡିତ ନୁହେଁ | ଆହୁରି ମଧ୍ୟ, ଅନ୍ୟାନ୍ୟ ଲେଆଉଟ୍ ସମ୍ବନ୍ଧୀୟ CSS ଗୁଣଗୁଡିକ, ଯେପରିକି ଫାଙ୍କା, ଆପଣ ଯେପରି ଆଶା କରନ୍ତି କାର୍ଯ୍ୟ କରନ୍ତି | ଜାଣିବା ପାଇଁ କ tr ଣସି କ icks ଶଳ କିମ୍ବା କାର୍ଯ୍ୟକ୍ଷେତ୍ର ନାହିଁ, ଏବଂ ଆପଣ ଯାହା ଶିଖନ୍ତି ତାହା MDN ରେ ଡକ୍ୟୁମେଣ୍ଟ୍ ହୋଇଛି | ମେସେରି JS lib ପାଇଁ, ପ୍ରାରମ୍ଭିକରଣ ଟିକେ ଜଟିଳ: ସ୍ତମ୍ଭ ଏବଂ ଫାଙ୍କା ଆକାର ସେଟ୍ କରିବା ପାଇଁ ଲୁକ୍କାୟିତ HTML ଉପାଦାନ ସହିତ ଏହା ଏକ ନିର୍ଦ୍ଦିଷ୍ଟ ବାକ୍ୟବିନ୍ୟାସ ସହିତ ଏକ ଡାଟା ଆଟ୍ରିବ୍ୟୁଟ୍ ଆବଶ୍ୟକ କରେ | ଏଥିସହ, ଯଦି ଆପଣ ସ୍ତମ୍ଭଗୁଡିକ ବିସ୍ତାର କରିବାକୁ ଚାହାଁନ୍ତି, ତେବେ ସମସ୍ୟାକୁ ଏଡାଇବା ପାଇଁ ଆପଣଙ୍କୁ ଫାଙ୍କା ଆକାର ଅନ୍ତର୍ଭୂକ୍ତ କରିବାକୁ ପଡିବ:
<ସ୍କ୍ରିପ୍ଟ src = "https://unpkg.com/masonry-layout@4.2.2/dist/masonry.pkgd.min.js"> <ଷ୍ଟାଇଲ୍> .track-sizer, .item { ମୋଟେଇ: 20%; } .ଗଟର୍-ସାଇଜର୍ { ମୋଟେଇ: 1rem; } .item { ଉଚ୍ଚତା: 100px; margin-block-end: 1rem; } .item: nth-child (ଅଦ୍ଭୁତ) { ଉଚ୍ଚତା: 200px; } .item - width2 { ମୋଟେଇ: କାଲ୍କ (40% + 1rem); }
ଆସନ୍ତୁ ଏହାକୁ ଏକ ବିଲ୍ଟ-ଇନ୍ ମାନସ ପ୍ରୟୋଗ କିପରି ଦେଖାଯିବ ତାହା ସହିତ ତୁଳନା କରିବା: <ଷ୍ଟାଇଲ୍> .container { ପ୍ରଦର୍ଶନ: ଗ୍ରୀଡ୍-ଗାଡ଼ି; ଗ୍ରୀଡ୍-ଗାଡ଼ି: ପୁନରାବୃତ୍ତି (4, 20%); ଫାଙ୍କ: 1rem; } .item { ଉଚ୍ଚତା: 100px; } .item: nth-child (ଅଦ୍ଭୁତ) { ଉଚ୍ଚତା: 200px; } .item - width2 { ଗ୍ରୀଡ୍ ସ୍ତମ୍ଭ: ସ୍ପାନ୍ 2; }
ସରଳ, ଅଧିକ କମ୍ପାକ୍ଟ କୋଡ୍ ଯାହା କେବଳ ଫାଙ୍କ ପରି ଜିନିଷ ବ୍ୟବହାର କରିପାରିବ ଏବଂ ଯେଉଁଠାରେ ସ୍ପାନିଂ ଟ୍ରାକ୍ ସ୍ପାନ୍ 2 ସହିତ କରାଯାଇଥାଏ, ଠିକ୍ ଗ୍ରୀଡ୍ ପରି, ଏବଂ ଫାଙ୍କା ଆକାର ଅନ୍ତର୍ଭୂକ୍ତ କରୁଥିବା ସଠିକ୍ ଓସାର ଗଣନା କରିବା ଆବଶ୍ୟକ କରେନାହିଁ | କ’ଣ ଉପଲବ୍ଧ ଏବଂ କେତେବେଳେ ଉପଲବ୍ଧ ତାହା କିପରି ଜାଣିବେ? ସାମଗ୍ରିକ ଭାବରେ, ପ୍ରଶ୍ନଟି ପ୍ରକୃତରେ ନୁହେଁ ଯଦି ଆପଣ ଏକ JS ଲାଇବ୍ରେରୀ ଉପରେ ବିଲ୍ଟ-ଇନ୍ ମାନସ ବ୍ୟବହାର କରିବା ଉଚିତ୍, ବରଂ କେବେ | ମ ason ସୁମୀ JS ଲାଇବ୍ରେରୀ ଆଶ୍ଚର୍ଯ୍ୟଜନକ ଏବଂ ବହୁ ବର୍ଷ ଧରି ୱେବ୍ ପ୍ଲାଟଫର୍ମରେ ଏକ ଫାଙ୍କା ପୂରଣ କରୁଛି ଏବଂ ଅନେକ ଖୁସି ବିକାଶକାରୀ ଏବଂ ବ୍ୟବହାରକାରୀଙ୍କ ପାଇଁ | ଏହାର କିଛି ଅସୁବିଧା ଅଛି ଯଦି ଆପଣ ଏହାକୁ ଏକ ବିଲ୍ଟ-ଇନ୍ ମେସନ୍ରି କାର୍ଯ୍ୟକାରିତା ସହିତ ତୁଳନା କରନ୍ତି, ଅବଶ୍ୟ, କିନ୍ତୁ ଯଦି ସେହି କାର୍ଯ୍ୟକାରିତା ପ୍ରସ୍ତୁତ ନହୁଏ ତେବେ ସେଗୁଡ଼ିକ ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ ନୁହେଁ | ଏହି ଶାନ୍ତ ନୂତନ ୱେବ୍ ପ୍ଲାଟଫର୍ମ ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ ତାଲିକାଭୁକ୍ତ କରିବା ମୋ ପାଇଁ ସହଜ କାରଣ ମୁଁ ଏକ ବ୍ରାଉଜର୍ ବିକ୍ରେତାଙ୍କଠାରେ କାମ କରେ, ଏବଂ ତେଣୁ କ’ଣ ଆସୁଛି ମୁଁ ଜାଣିବାକୁ ଇଚ୍ଛା କରେ | କିନ୍ତୁ ବିକାଶକାରୀମାନେ ପ୍ରାୟତ share ଅଂଶୀଦାର କରନ୍ତି, ସର୍ଭେ ପରେ ସର୍ଭେ କରନ୍ତି ଯେ ନୂତନ ଜିନିଷ ଉପରେ ନଜର ରଖିବା କଷ୍ଟକର | ସୂଚନାଯୋଗ୍ୟ ରହିବା କଷ୍ଟସାଧ୍ୟ, ଏବଂ କମ୍ପାନୀଗୁଡିକ ସର୍ବଦା ଶିଖିବାକୁ ପ୍ରାଥମିକତା ଦିଅନ୍ତି ନାହିଁ | ଏଥିରେ ସାହାଯ୍ୟ କରିବାକୁ, ଏଠାରେ କିଛି ଉତ୍ସ ଅଛି ଯାହା ସରଳ ଏବଂ କମ୍ପାକ୍ଟ ଉପାୟରେ ଅପଡେଟ୍ ପ୍ରଦାନ କରେ ଯାହା ଦ୍ you ାରା ଆପଣ ଶୀଘ୍ର ଆବଶ୍ୟକ କରୁଥିବା ସୂଚନା ପାଇପାରିବେ:
ୱେବ୍ ପ୍ଲାଟଫର୍ମ ଏକ୍ସପ୍ଲୋରର ସାଇଟ୍ ବ features ଶିଷ୍ଟ୍ୟ କରେ: ଆପଣ ଏହାର ରିଲିଜ୍ ନୋଟ୍ ପୃଷ୍ଠାରେ ଆଗ୍ରହୀ ହୋଇପାରନ୍ତି | ଏବଂ, ଯଦି ଆପଣ RSS ପସନ୍ଦ କରନ୍ତି, ରିଲିଜ୍ ନୋଟ୍ ଫିଡ୍, ଏବଂ ବେସ୍ ଲାଇନ୍ ନୂତନ ଉପଲବ୍ଧ ଏବଂ ବ୍ୟାପକ ଉପଲବ୍ଧ ଫିଡ୍ ଯାଞ୍ଚ କରନ୍ତୁ |
ୱେବ୍ପ୍ଲାଟଫର୍ମ ସ୍ଥିତି ଡ୍ୟାସବୋର୍ଡ: ଆପଣ ଏହାର ବିଭିନ୍ନ ବେସ୍ ଲାଇନ୍ ବର୍ଷ ପୃଷ୍ଠାଗୁଡ଼ିକୁ ପସନ୍ଦ କରିପାରନ୍ତି |
କ୍ରୋମ୍ ପ୍ଲାଟଫର୍ମ ସ୍ଥିତି ’ରୋଡ୍ ମ୍ୟାପ୍ ପୃଷ୍ଠା |
ଯଦି ଆପଣଙ୍କର ଟିକିଏ ଅଧିକ ସମୟ ଅଛି, ଆପଣ ବ୍ରାଉଜର୍ ବିକ୍ରେତାଙ୍କ ରିଲିଜ୍ ନୋଟ୍ ପାଇଁ ମଧ୍ୟ ଆଗ୍ରହୀ ହୋଇପାରନ୍ତି:
କ୍ରୋମ୍ ଧାର ଫାୟାରଫକ୍ସ | ସଫାରି |
ଆହୁରି ଅଧିକ ଉତ୍ସ ପାଇଁ, ମୋର ୱେବ୍ ପ୍ଲାଟଫର୍ମ ଚିଟ୍ସିଟ୍ କୁ ନେଭିଗେଟ୍ କରନ୍ତୁ | ମୋର କଥା ଏପର୍ଯ୍ୟନ୍ତ କାର୍ଯ୍ୟକାରୀ ହୋଇନାହିଁ | ତାହା ହେଉଛି ସମସ୍ୟାର ଅନ୍ୟ ପାର୍ଶ୍ୱ | ଯଦିଓ ତୁମେ ଟ୍ରାକ୍ ରଖିବାର ସମୟ, ଶକ୍ତି, ଏବଂ ଉପାୟ ଖୋଜୁଛ, ତଥାପି ତୁମର ସ୍ୱର ଶୁଣିବା ଏବଂ ତୁମର ପ୍ରିୟ ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ କାର୍ଯ୍ୟକାରୀ ହେବାରେ ନିରାଶା ଅଛି | ବୋଧହୁଏ ଆପଣ ଏକ ନିର୍ଦ୍ଦିଷ୍ଟ ତ୍ରୁଟି ସମାଧାନ ପାଇଁ ବର୍ଷ ବର୍ଷ ଧରି ଅପେକ୍ଷା କରିଥିବେ, କିମ୍ବା ଏକ ବ୍ରାଉଜରରେ ପଠାଇବାକୁ ଏକ ନିର୍ଦ୍ଦିଷ୍ଟ ବ feature ଶିଷ୍ଟ୍ୟ ଯେଉଁଠାରେ ଏହା ଏପର୍ଯ୍ୟନ୍ତ ନିଖୋଜ ଅଛି | ମୁଁ ଯାହା କହିବି ବ୍ରାଉଜର୍ ବିକ୍ରେତାମାନେ ଶୁଣନ୍ତି | ମୁଁ ଅନେକ କ୍ରସ୍-ସଂଗଠନ ଦଳର ଅଂଶ ଅଟେ ଯେଉଁଠାରେ ଆମେ ସବୁବେଳେ ବିକାଶକାରୀ ସଙ୍କେତ ଏବଂ ମତାମତ ବିଷୟରେ ଆଲୋଚନା କରୁ | ଆମେ ବିଭିନ୍ନ ବ୍ରାଉଜର୍ ବିକ୍ରେତା ଏବଂ ଫୋରମ୍, ଓପନ୍ ସୋର୍ସ ପ୍ରୋଜେକ୍ଟ, ବ୍ଲଗ୍, ଏବଂ ସର୍ବେକ୍ଷଣରେ ବାହ୍ୟ / ସାର୍ବଜନୀନ ମତାମତର ବିଭିନ୍ନ ଉତ୍ସକୁ ଦେଖୁ | ଏବଂ, ଆମେ ସବୁବେଳେ ବିକାଶକାରୀଙ୍କ ପାଇଁ ସେମାନଙ୍କର ନିର୍ଦ୍ଦିଷ୍ଟ ଆବଶ୍ୟକତା ବାଣ୍ଟିବା ଏବଂ ମାମଲା ବ୍ୟବହାର କରିବା ପାଇଁ ଉତ୍ତମ ଉପାୟ ସୃଷ୍ଟି କରିବାକୁ ଚେଷ୍ଟା କରୁଛୁ | ତେଣୁ, ଯଦି ଆପଣ କରିପାରିବେ, ଦୟାକରି ବ୍ରାଉଜର୍ ବିକ୍ରେତାମାନଙ୍କଠାରୁ ଅଧିକ ଦାବି କରନ୍ତୁ ଏବଂ ଆପଣ ଆବଶ୍ୟକ କରୁଥିବା ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ କାର୍ଯ୍ୟକାରୀ କରିବାକୁ ଆମକୁ ଚାପ ଦିଅନ୍ତୁ | ମୁଁ ପାଇଲି ଯେ ଏହା ସମୟ ନିଏ, ଏବଂ ଏହା ମଧ୍ୟ ଭୟଭୀତ ହୋଇପାରେ (ପ୍ରବେଶ ପାଇଁ ଏକ ଉଚ୍ଚ ପ୍ରତିବନ୍ଧକ ବିଷୟରେ ନୁହେଁ), କିନ୍ତୁ ଏହା ମଧ୍ୟ କାମ କରେ | ତୁମର (କିମ୍ବା ଆପଣଙ୍କ କମ୍ପାନୀର) ସ୍ୱର ଶୁଣିବାକୁ ଏଠାରେ କିଛି ଉପାୟ ଅଛି: ବାର୍ଷିକ ଷ୍ଟେଟ୍ ଅଫ୍ ଜେଏସ୍, ଷ୍ଟେଟ୍ ଅଫ୍ ସିଏସ୍ଏସ୍ ଏବଂ ଷ୍ଟେଟ୍ ଅଫ୍ HTML ସର୍ଭେ ନିଅ | ବ୍ରାଉଜର୍ ବିକ୍ରେତାମାନେ କିପରି ସେମାନଙ୍କ କାର୍ଯ୍ୟକୁ ପ୍ରାଥମିକତା ଦିଅନ୍ତି ସେଥିରେ ସେମାନେ ଏକ ପ୍ରମୁଖ ଭୂମିକା ଗ୍ରହଣ କରନ୍ତି | ବ୍ରାଉଜର୍ ଗୁଡିକରେ କ୍ରମାଗତ ଭାବରେ କାର୍ଯ୍ୟକାରୀ ହେବା ପାଇଁ ଯଦି ଆପଣ ଏକ ନିର୍ଦ୍ଦିଷ୍ଟ ମାନକ-ଆଧାରିତ API ଆବଶ୍ୟକ କରନ୍ତି, ପରବର୍ତ୍ତୀ ଇଣ୍ଟରପ୍ ପ୍ରୋଜେକ୍ଟ ପୁନରାବୃତ୍ତିରେ ଏକ ପ୍ରସ୍ତାବ ଦାଖଲ କରିବାକୁ ଚିନ୍ତା କରନ୍ତୁ | ଏହା ଅଧିକ ସମୟ ଆବଶ୍ୟକ କରେ, କିନ୍ତୁ ଧ୍ୟାନ ଦିଅନ୍ତୁ କିପରି Shopify ଏବଂ RUMvision ଇଣ୍ଟରପ୍ 2026 ପାଇଁ ସେମାନଙ୍କର ଇଚ୍ଛା ତାଲିକା ଅଂଶୀଦାର କଲା | ବ୍ରାଉଜର୍ ବିକ୍ରେତାମାନଙ୍କୁ ପ୍ରାଥମିକତା ଦେବା ପାଇଁ ଏହି ପରି ବିସ୍ତୃତ ସୂଚନା ଅତ୍ୟନ୍ତ ଉପଯୋଗୀ ହୋଇପାରେ | ବ୍ରାଉଜର୍ ବିକ୍ରେତାମାନଙ୍କୁ ପ୍ରଭାବିତ କରିବା ପାଇଁ ଅଧିକ ଉପଯୋଗୀ ଲିଙ୍କ୍ ପାଇଁ, ମୋର ୱେବ୍ ପ୍ଲାଟଫର୍ମ ଚିଟ୍ସିଟ୍ ନେଭିଗେଟ୍ କରନ୍ତୁ | ସିଦ୍ଧାନ୍ତ ବନ୍ଦ କରିବାକୁ, ମୁଁ ଆଶା କରେ ଏହି ଆର୍ଟିକିଲ୍ ଆପଣଙ୍କୁ କିଛି ଜିନିଷ ବିଷୟରେ ଚିନ୍ତା କରିବାକୁ ଛାଡି ଦେଇଛି:
ମାନସ ଏବଂ ଅନ୍ୟାନ୍ୟ ଆଗାମୀ ୱେବ୍ ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକ ପାଇଁ ଉତ୍ସାହ | କିଛି ୱେବ୍ ବ features ଶିଷ୍ଟ୍ୟ ଯାହା ଆପଣ ବ୍ୟବହାର ଆରମ୍ଭ କରିବାକୁ ଚାହିଁପାରନ୍ତି | କଷ୍ଟମ୍ କିମ୍ବା ତୃତୀୟ-ପକ୍ଷ କୋଡ୍ ର କିଛି ଖଣ୍ଡ ଆପଣ ବିଲ୍ଟ-ଇନ୍ ବ features ଶିଷ୍ଟ୍ୟ ସପକ୍ଷରେ ଅପସାରଣ କରିବାକୁ ସମର୍ଥ ହୋଇପାରନ୍ତି | କ’ଣ ଆସୁଛି ତାହା ଉପରେ ନଜର ରଖିବା ଏବଂ ବ୍ରାଉଜର୍ ବିକ୍ରେତାଙ୍କୁ ପ୍ରଭାବିତ କରିବାର କିଛି ଉପାୟ |
ଅଧିକ ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ ହେଉଛି, ମୁଁ ଆଶା କରୁଛି ଯେ ୱେବ୍ ପ୍ଲାଟଫର୍ମକୁ ଏହାର ପୂର୍ଣ୍ଣ ସାମର୍ଥ୍ୟକୁ ବ୍ୟବହାର କରିବାର ଲାଭ ବିଷୟରେ ମୁଁ ଆପଣଙ୍କୁ ନିଶ୍ଚିତ କରିଛି |
