क्लाइंट साइड

Question

पर जेसन परिणाम की बड़ी मात्रा कैश है मेरे पास एएसपीएनटी एमवीसी एप्लीकेशन है जो जेएसओएन परिणाम देता है जिसमें कई वर्षों के डेटा के साथ जेएसओएन परिणाम होता है जो तब जावास्क्रिप्ट चार्ट पर प्रदान किया जाता है।

एक अच्छा उपयोगकर्ता अनुभव (प्रदर्शन के संदर्भ में) के लिए, मैं सबसे अच्छा समाधान ढूंढ रहा हूं कि क्लाइंट पक्ष पर JSON डेटा कैश करना संभव है, ताकि जब उपयोगकर्ता चार्ट पर विभिन्न मानकों के साथ दिन पर क्लिक करता है, सप्ताह दृश्य आदि, एक ही JSON डेटा सर्वर को मारने के बिना पूछताछ की जाती है।

क्या कोई व्यक्ति कृपया क्लाइंट साइड या सर्वर पक्ष पर डेटा कैश किया जाना चाहिए या प्रत्येक ग्राफ टॉगल के लिए सीधे डेटाबेस को हिट करना चाहिए या नहीं, इस पर सर्वोत्तम प्रथाओं को कैश करने का सर्वोत्तम निर्णय लेने में हमारी सहायता कर सकता है?

अग्रिम धन्यवाद।

Answer 1

सबसे पहले, डेटाबेस कहां है? यदि आप गीगाबिट लैन के साथ स्थानीय नेटवर्क पर हैं, तो इसे मारना कोई समस्या नहीं होगी। हालांकि, यह इंटरनेट पर सच नहीं है। लोगों के पास सीमित बैंडविड्थ है, खासकर मोबाइल पर, और इस प्रकार आपको अपनी HTTP कॉल सीमित करनी चाहिए। इसके अलावा, कम HTTP कॉल का मतलब सर्वर पर कम तनाव है।

यहाँ कुछ सुझाव हैं:

• पृष्ठांकन

  पर विचार करें जब "2 साल के लायक" लोड हो रहा है, मैं एक बहुत कल्पना, एक 100 + पेज थीसिस की तरह। उन्हें एक साथ लोड करने के बजाय पेजिंग डेटा पर विचार करें। यह आपको बैंडविड्थ के साथ ही कैश स्पेस बचाता है (यदि कभी भी सीमित है)।

  कैसे करें: सर्वर स्क्रिप्ट क्लाइंट चाहता है के अनुसार डेटा को टुकड़ा कर दें। क्वेरी में LIMIT का उपयोग कर SQL में पेजिनेशन बनाना बहुत आसान है। तर्क

• JSONify डेटा

  करने के लिए और नेटवर्क से डेटा के परिवहन के लिए उपयोग JSON की तरह है। हल्के होने के अलावा, यह भी संरचित है। बाद में पार्स करना और स्टोर करना आसान होगा।

  कैसे करें: PHP में JSON स्ट्रिंग में सरणी को कन्वर्ट करने के लिए json_encode फ़ंक्शन है। मुझे लगता है कि आपके ढांचे में एक समान सुविधा है। स्ट्रिंग को किसी पृष्ठ पर प्रतिबिंबित करें, फिर JSON स्ट्रिंग से जेएस ऑब्जेक्ट में कनवर्ट करने के लिए JSON.parse का उपयोग करें। JSON methodsmodern browsers में देशी आने लेकिन अगर आप पुराने ब्राउज़र पूरा करने के लिए की जरूरत है, Crockford has a library यह पार्स करने के लिए

• एक प्रसिद्ध भंडारण ढांचे

  का प्रयोग करें एक लगातार भंडारण पेज भर में कैश के लिए आवश्यक है, मैं हाल ही में PersistJS में आए जो ब्राउज़र पर उपलब्ध स्थानीय स्टोरेज को सार तत्व। इसके अलावा, यहां एक JS implementation of LZW है। इसे सुविधाजनक रखें क्योंकि स्थानीय स्टोरेज डेटा स्टोर करने के लिए तारों का उपयोग करता है और इसमें 5-10 एमबी सीमा है।

  कैसे करें: डेटा को JSON.stringify का उपयोग करके स्ट्रिंग में कनवर्ट करें और इसे PersistJS के साथ स्टोर करें। फिर पुनः प्राप्ति के लिए, स्ट्रिंग हो और केवल आवश्यकता

  कैश प्रणाली है केवल सर्वर फोन अगर कुछ संशोधित किया गया है का उपयोग कर JSON.parse()

• कॉल इसे वापस पार्स, जोड़ा या अगर कुछ वहाँ नहीं है। यदि डेटा है, तो आप इसके लिए सर्वर क्यों कॉल कर सकते हैं?

• सिंक कैश

  आप पुराना डेटा का डर है, तो कुछ AJAX इस विकि के बारे में Comet में वर्णित के रूप प्राप्त करते समय लाइव डेटा के कुछ विधि का उपयोग कर अपने कैश प्रणाली सिंक है।

अंतिम दो बिंदु आपके कैश ढांचे पर निर्भर करते हैं। लेकिन BackboneJS सर्वर के सिंक करने के लिए इसके मॉडल और संग्रह की अनुमति देता है, जिसमें मैंने वही कार्यक्षमता का उल्लेख किया है।

Answer 2

मैंने जो किया है वह मैंने किया है और यह मेरा अनुभव है। मैं काम पर ओरेकल के साइट स्टूडियो मिडलवेयर का उपयोग करता हूं। मैंने एक ढांचा की तलाश की जो इसके साथ काम करेगी लेकिन उसे नहीं मिला। तो मैंने नीचे दोनों विकल्पों की कोशिश की है।

1) डेटाबेस क्वेरी पंक्तियों की एक निश्चित राशि देता है। मैंने परीक्षण के रूप में 2,000 की कोशिश की। एक साधारण फोरैच लूप लौटाए गए डेटा को JSON डेटा में परिवर्तित करता है। तो यह सचमुच JSON चर के एक लंबे सरणी बनाता है क्योंकि यह पंक्तियों के माध्यम से loops। इस तरह आप स्थानीय डबबेस के स्नैपशॉट की नकल कर रहे हैं। जेएस वास्तव में सरणी तत्वों को बहुत तेज़ी से एक्सेस कर सकता है और यह आपको आश्चर्यचकित कर सकता है कि आप कितनी तेजी से जानकारी को बदल सकते हैं, बदल सकते हैं, हटा सकते हैं।

<script> 
var appData = [{'id':'0','first':'Sam','last':'Smith'},{'id':'1','first':'Dan','last':'Smith'}]; 
</script> 

यह JSON डेटा एक स्क्रिप्ट टैग के भीतर निहित है। DQuery.ready पर JQuery तब डेटा पढ़ता है और इसे आवश्यकतानुसार HTML टेक्स्ट में जोड़ता है। जब कोई उपयोगकर्ता JSON डेटा मान बदलता है तो AJAX आग लग जाती है और डेटाबेस में परिवर्तन सहेजती है। इस तरह की प्रणाली को आपके आवेदन में जोड़ना बहुत मुश्किल नहीं है। मैंने Google के कोणीय.जेएस का उपयोग बाद में यूआई को एक साफ एमवी पैटर्न रखने के लिए डेटा को बाध्य करने के लिए किया और तेजी से क्लाइंट साइड के प्रकार और फ़िल्टरिंग करना भी आसान है। जैसा कि पहले से ही उल्लेख किया गया है Backbone.js और अन्य जेएस ढांचे क्लाइंट डेटा को सर्वर पर सिंक्रनाइज़ कर सकते हैं।

2) दूसरे तरीके से मैंने एक HTML पृष्ठ पर डेटा सहेजा है, एक बार फिर से लौटाई पंक्तियों के माध्यम से एक फोरच के माध्यम से लूप करना है। फिर मैंने पुराने फैशन

<input type="hidden" name="someName" value="someValue" /> 

का उपयोग करके HTML में डेटा को सहेज लिया, फिर मैंने डेटा को संसाधित करने और इसे UI में जोड़ने के लिए JQuery का उपयोग किया। क्या तुम सच में JSON के साथ जंगली प्राप्त करना चाहते हैं तो आप वास्तव में इतने

<input type="hidden name="row1" value="{'color':'red','style':'fancy','age':'44'}" /> 

फिर आप डेटा की प्रक्रिया और अपने यूआई के लिए यह बाध्य करने के लिए JQuery या Angular.js उपयोग कर सकते हैं की तरह HTML चर में एम्बेड कर सकते हैं।

यह दिलचस्प है कि बहुत से अनुप्रयोग ढांचे क्लाइंट साइड कैशिंग सिस्टम में निर्मित नहीं हैं। यह सर्वर पक्ष पर एक चयन मेनू को सॉर्ट करने के लिए वास्तव में अक्षम है और फिर HTML को पुनर्निर्माण करता है। जेएस में इसे सॉर्ट करने के लिए बेहतर और गतिशील रूप से चयन मेनू का पुनर्निर्माण करें। यहां सुरक्षा के साथ चिंता है और आप निजी जानकारी को JSON या HTML चर में प्रिंट नहीं करना चाहेंगे क्योंकि यह दृश्य स्रोत के अंतर्गत दिखाई दे रहा है। इसके अलावा आप अधिक दुष्ट तकनीक का उपयोग कर पृष्ठों में डेटा एम्बेड कर सकते हैं। नीचे विचार करें:

<span class="data" value="1234"></span> 
$(function() { 
    $('.data').each(function() { 
     var val = $(this).attr('value'); 
     console.log(val); //process data 
    }); 
}); 

फिर आप डेटा नामक कक्षाओं को संसाधित करने के लिए dQuery.ready पर JQuery का उपयोग कर सकते हैं। आप जेएसओएन डेटा को मूल्य में भी सामान डाल सकते हैं और इसे बाद में पार्स कर सकते हैं। ध्यान रखें कि JQuery लोग इस तरह से कक्षाओं का उपयोग कर डेवलपर्स के खिलाफ हैं। मेरे अनुभव में यदि आप इसके साथ ओवरबोर्ड नहीं जाते हैं तो यह बहुत अच्छा काम करता है।

Answer 3

1. डेटाबेस से डेटा को पुनः प्राप्त करें और सर्वर पर एक स्थिर फ़ाइल के रूप में सहेजें। एक .css या .png एक्सटेंशन दें। (ब्राउज़र स्वचालित रूप से स्टाइलशीट और छवि फ़ाइलों को कैश करेगा।)।
2. डेटा फ़ाइल नाम को एक छिपे हुए क्षेत्र में टाइमस्टैम्प से सहेजें। (सुनिश्चित करने के लिए कि फ़ाइल में कोई बदलाव होने पर सर्वर से नवीनतम फ़ाइल लोड करना सुनिश्चित करें)
3. AJAX का उपयोग कर सर्वर से फ़ाइल लोड करें, पहली बार यह लोड होगा सर्वर, लेकिन अगली बार यह ब्राउज़र कैश से लोड होगा।
4. आप AJON अनुरोध परिणाम पार्स करने के लिए JSON.Parse() का उपयोग कर सकते हैं।