jQuery ऑटोकंपलेट (अपरिहार्य रूप से लंबी सूचियों) को तेज करना

Question

मैंने आज दोपहर के पहले jQuery की स्वत: पूर्णता को गति देने की अपनी यात्रा शुरू की, और निर्णय लिया कि सब कुछ शुरू करने के लिए शायद यह एक अच्छा विचार था। जैसा कि इस आलेख में सुझाया गया है: Speeding up autocomplete।

हालांकि, मैं अभी भी मेमकैड स्थापित करने और उपयोग करने के बाद भी धीमी प्रतिक्रिया समय से निपट रहा हूं।

मेरे मामले में समस्या यह है कि मैं अपने मामले में असाधारण रूप से लंबी सूचियों से निपट रहा हूं, व्यक्तिगत सदस्य। (सभी पीढ़ी या सभी पौधों की genuses)

टोंटी तालिका का निर्माण और क्लाइंट-साइड सूची को आबाद करने जा रहा है, और यह Memcached से जानकारी प्राप्त करने के कारण नहीं है।

यदि कोई और इस विशेष समस्या में चला गया है, तो मुझे इसे हल करने के लिए एक चालाक तरीका सुनना अच्छा लगेगा। मैं नीचे अपना कोड पोस्ट करूंगा।

नोट: यह विशेष पृष्ठ आम जनता के लिए अनुपलब्ध है, और मुझे पता है कि कुछ अंतरंग सुरक्षा छेद हैं।

---

require_once 'oo/Database.php'; 

$mysqldb = new Database; 

$memcache = new Memcache; 
$memcache->connect('localhost', 11211) or die ("Could not connect to memcache"); 

$sql = "SELECT DISTINCT `Genus` FROM importlist.plants"; 

$key = md5('query'.$sql); 

$result = $memcache->get($key); 


//check if we got something back 
if($result == null) { 

    //fetch from database 
    $result = $mysqldb->rawSelect($sql)->getResult(); 

    //set to memcache, expires after 1 hour 
    $memcache->set($key,$result,0,3600); 
} 

//Result array 
$Genera = ($memcache->get($key)); 

//Add required "quotation marks" for autocomplete 
foreach ($Genera as &$Genus){ 
    $Genus = '"'.$Genus[Genus].'"'; 
} 
$Genera = implode($Genera,','); 

//PHP to generate jQuery  
echo <<< EOT 

    <script> 
    $(function() { 
     var availableTags = [$Genera]; 
     $("#tags").autocomplete({ 
      source: availableTags 
     }); 
    }); 
    </script> 
EOT; 

?> 

<input id="tags" /> 

Answer 1

$(document).ready(function() { 

    // once page loads, make AJAX request to get your autocomplete list and apply to HTML 
    $.ajax({ url: '/path-to-get-tags-as-json.php', 
     type: "GET", 
     contentType: "application/json", 
     success: function(tags) { 
      $("#tags").autocomplete({ 
       source: tags 
      }); 
     } 
    }); 
}); 

प्लेस में अपने PHP फ़ाइल का URL AJAX प्लेसहोल्डर यूआरएल ऊपर पैरामीटर में स्वतः पूर्ण सूची उत्पन्न करता है। इतना है कि यह तो जैसे मूल्यों की एक JSON सारणी रिटर्न अपने PHP कोड में, सूची पीढ़ी को संशोधित:

[ "first" , "second" , "anotherEntry" , "in" , "the" , "array" ]  

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

यह लोड समय के लिए बहुत अच्छा है जो कई सेकंड से कम है, लेकिन यदि यह आपको उससे अधिक समय ले रहा है तो आपके उपयोगकर्ता अभी भी उपयोगिता समस्या में भाग ले सकते हैं।

यदि सर्वर-साइड देरी अभी भी हैं, तो कुछ समय बयान का उपयोग करने पर विचार करें कि यह कहां है कि बाधा कहां है।

Answer 2

चूंकि आप कम से कम 1 वर्ण टाइप करते समय कुछ भी नहीं देख सकते हैं, तो आप 26 अलग-अलग सूचियां बना सकते हैं। प्रत्येक स्वत: पूर्ण सूची में केवल वे आइटम होते हैं जो उस पत्र से शुरू होते हैं। लोड करने के लिए आपकी सूचियां काफी छोटी और तेज होंगी।

इसे और भी तेज बनाने के लिए, और सूचियां बनाएं। आपको शायद प्रदर्शित करने के लिए केवल पहले 30-40 आइटमों की आवश्यकता है। यदि आइटम छोटी सूची में नहीं है, तो उपयोगकर्ता शायद एक और अक्षर टाइप करेगा। फिर आप अपनी सूचियों को 26 * 26 अद्वितीय सूचियों में विभाजित कर सकते हैं। प्रत्येक सूची जिसमें केवल 2 आइटम होते हैं जो पहले 2 अक्षरों से शुरू होते हैं।

आप अपनी वस्तुओं को आवश्यकतानुसार कई सूचियों में विभाजित कर सकते हैं। हम इसे ऐसी साइट पर करते हैं जहां मैं प्रबंधित करता हूं जहां हमारे पास हमारे टाइपहेड में 500K से अधिक आइटम उपलब्ध हैं।