Get last line from a textarea on keypress

Question

I have a textarea field and on every keypress, I would like to push the last line in the textarea to an array.

Currently, I am constructing the array on every keypress to get the last line in the textarea. Is there a way to optimize this? Meaning, get last line in the textarea without having to construct an array.

jQuery('#mytextarea').keypress(function() {
    lines = jQuery('#mytextarea').text().split("\n");
    lastLine = lines[lines.length - 1];

});

if(.. some condition ..) {
myArray.push(lastLine);

Why would you need to optimize this? This will take a nano second to execute and its not executed on your server. — Deepsy, May 30 '13 at 15:20
@SrikanthAD - ah, u prefer ur javascript to take longer to parse. to each their own i suppose. — PlantTheIdea, May 30 '13 at 15:21
You could use the blur event and then read the last line. Not sure why you want to do it on every single key press. — Dave, May 30 '13 at 15:21
As the content of the textarea grows, on every keypress - an array is being constructed just to get the last line. I wish I did not have to construct the array on every keypress. Moreover, I am not manipulating the array in any way so, I am looking for ways to optimize this. — Srikanth AD, May 30 '13 at 15:22
The blur event may not be helpful as the textarea always has the focus. — Srikanth AD, May 30 '13 at 15:24
@PlantTheIdea: late to the party. `scriptaculous` and a bunch of other JS libs could also be bound to `$`. Using `jQuery` is a nice thing to do just for that edge case. — Sébastien Renauld, May 30 '13 at 15:38
@SébastienRenauld - or you could just prevent conflicts when the jQuery script is parsed, containing the `$` to the script => http://stackoverflow.com/questions/8524700/using-jquery-noconflict-with-scriptaculous — PlantTheIdea, May 30 '13 at 15:42
@PlantTheIdea: That's another of the many possibilities. Still, needs to be done :-) — Sébastien Renauld, May 30 '13 at 15:44
@SébastienRenauld - oh, no question there. i just prefer to write my code in the most efficient way possible, and javascript should be as compact as possible. using `jQuery` instead of `$` means you are writing 5 more characters for every function or method called, increasing the length of ur code by a large % which increases pageload times. that was my only point. — PlantTheIdea, May 30 '13 at 15:48

score 10 · Accepted Answer · edited May 23 '17 at 11:45

10

Indeed, there is a way to optimize this. The optimization is mostly memory usage - the actual CPU usage is also improved.

The optimized version relies on lastIndexOf(). It is as follows:

jQuery("#mytextarea").keypress(function() {
     var content = this.value;
     var lastLine = content.substr(content.lastIndexOf("\n")+1);
});

You will notice a couple of micro-optimizations:

this already is the DOM element. There is little point in re-invoking jQuery just to get the text content. Saves a bit on processor
using lastIndexOf allows me to get anything after the last \n

Dogbert provided a benchmark for the lastIndexOf: http://jsperf.com/splitting-large-strings

edited May 23 '17 at 11:45

Community

1
1

answered May 30 '13 at 15:21

Sébastien Renauld

19,203
2
46
66

dont forget the fact you're using actual javascript instead of jQuery to get the text, which is always faster :D – PlantTheIdea May 30 '13 at 15:22
I don't think CPU usage would be the same in both the approaches; yours should be faster. Waiting for your benchmark. :) – Dogbert May 30 '13 at 15:23
@Dogbert: It'll be *nearly* the same. The bit where I saved him CPU cycles is the jQuery invocation I removed, *not* the `split`. – Sébastien Renauld May 30 '13 at 15:24
@SébastienRenauld - oh thats what u meant by not reinvoking jQuery, not wrapping `this` to form an object and using the jQuery `.text()` method. i misunderstood what u meant. – PlantTheIdea May 30 '13 at 15:24
More than CPU usage, I am looking for code optimization (better code logic/organization). I think @SébastienRenauld answer will help me. I I will give it a try. Thank you. – Srikanth AD May 30 '13 at 15:28
@SébastienRenauld, did I get it right here? http://jsperf.com/splitting-large-strings – Dogbert May 30 '13 at 15:32
@SébastienRenauld could you please check your code? When I log the variable lastLine, it seems to be empty. http://codepen.io/seraphzz/pen/EuiKI – Srikanth AD May 30 '13 at 15:58
1

@SrikanthAD: change `.innerText` to `.value`. Forgot we were using textareas here. – Sébastien Renauld May 30 '13 at 16:00

Get last line from a textarea on keypress

1 Answers1

Linked