[AF] Reducing number of AJAX Requests
Hi there. I've been slowly improving my Flask web development skills, and I recently implemented some jQuery into my app in order to provide some "inline" form checking. I used [this as a reference](http://flask.pocoo.org/docs/0.11/patterns/jquery/#json-view-functions) when doing so.
**the route**
@app.route('/_form_counter', methods=['GET'])
def _form_counter():
if 'form_args' in request.args:
result = len(request.args['form_args'].splitlines())
else:
result = 0
return jsonify(result=result)
**the JS**
$(function() {
$('#form-count').text('Count: 0');
$('#sensor_ids').on('keyup', function() {
form_args = $('#sensor_ids').val()
$.getJSON($SCRIPT_ROOT + '/_form_counter', {
form_args: form_args,
}, function(data) {
$('#form-count').text('Count: ' + data.result)
});
});
});
Everything works the way I want it to, however, in order to keep the code modular and reusable, I have different JS files that perform different operations. The one I shared just puts a little counter at the bottom of the textarea which displays the count, but I have another one which checks if there are duplicates so you can correct it before you submit, and so on. Each of these little bits has its own JS file, and so whenever the form field is edited, it performs `n` requests, where `n` is the number of little modules I'm using.
I'm wondering if this is normal, because it feels a little cluttered. I feel like this wouldn't scale well, but I don't have any evidence to the contrary. I guess what I'm asking is if there's a way I can continue to keep these jQuery snippets modular, without having as many requests?
/r/flask
http://redd.it/5fsh9b
Hi there. I've been slowly improving my Flask web development skills, and I recently implemented some jQuery into my app in order to provide some "inline" form checking. I used [this as a reference](http://flask.pocoo.org/docs/0.11/patterns/jquery/#json-view-functions) when doing so.
**the route**
@app.route('/_form_counter', methods=['GET'])
def _form_counter():
if 'form_args' in request.args:
result = len(request.args['form_args'].splitlines())
else:
result = 0
return jsonify(result=result)
**the JS**
$(function() {
$('#form-count').text('Count: 0');
$('#sensor_ids').on('keyup', function() {
form_args = $('#sensor_ids').val()
$.getJSON($SCRIPT_ROOT + '/_form_counter', {
form_args: form_args,
}, function(data) {
$('#form-count').text('Count: ' + data.result)
});
});
});
Everything works the way I want it to, however, in order to keep the code modular and reusable, I have different JS files that perform different operations. The one I shared just puts a little counter at the bottom of the textarea which displays the count, but I have another one which checks if there are duplicates so you can correct it before you submit, and so on. Each of these little bits has its own JS file, and so whenever the form field is edited, it performs `n` requests, where `n` is the number of little modules I'm using.
I'm wondering if this is normal, because it feels a little cluttered. I feel like this wouldn't scale well, but I don't have any evidence to the contrary. I guess what I'm asking is if there's a way I can continue to keep these jQuery snippets modular, without having as many requests?
/r/flask
http://redd.it/5fsh9b