title: JS, Vue: how to split text based on window height?
body: <p>I have text that I want to split at a specific point so that you dont need to scroll down. </p>
  
  <p>That means I want to know when the text gets longer than the availible height of the window. This needs to be known before I show the text. The problem with that is that I need to know how my layout will look like before I render it, because the whole thing should be responsive to width and height. </p>
  
  <p>I also plan to resize the fontsizes a little. So taking all that to account, does anyone of you know of you know how to split the text at the correct point? </p>
  
  <p>Thank you in advance.</p>
  
  <p>PS: The text is actually an array and is looking like this for e.g.: </p>
  
  <pre><code>text = [{content: Hello, wordID: ..., offsetBegin: 0, offsetEnd: 5,
           ...},{content: World!, wordID: ..., offsetBeding: 7, offsetEnd: 12,...}]
  </code></pre>
  
  <p>So the only thing I need to know is the indexes on where to split the text so that there are no scrolbars on the main window. Splitting the text can occur more than once too.</p>
  
  <p>The whole thing will start to be displayed and computed in the mounted() hook and will be recomputed each time the 'resize' event of for window is fired.  </p>