When does JSON overload become a problem?

Creating a bookmarking site similar to delicious has been my latest project. To ensure an optimized user experience, I have decided to fetch all the bookmarks from the database table and organize them into a JSON object containing essential data such as id, title, url, description, and tags for each bookmark. The JSON object is generated during the initial page load and then dynamically styled and injected using jquery.each.

Without having the ability to test it yet, one question lingers in my mind: What would be the impact on browser performance or any potential issues that could arise if a user were to save an unlimited number of bookmarks, let's say 2000, especially since pagination is not an option for this particular project?

Answer №1

Here's a thought that might stir up some debate. Why isn't paging considered as an option? Is there ever a situation where displaying 2k bookmarks all at once is necessary? I highly doubt it.

Not only does showing that much data increase the risk of DDOS attacks (especially if there is a large amount of text involved), but it also puts unnecessary strain on your servers. Just imagine if an attacker were able to access a URL containing megabytes of JSON - your servers would be in serious trouble.

It would be helpful to know more about your UI so we can better understand the data you truly need for optimal functionality.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Include draggable functionality to a seating chart that is generated dynamically

I developed a function that generates table seats dynamically with equal spacing. The issue arises when I try to drag names from a list and drop them onto the seats as children. Unfortunately, I can't seem to achieve this functionality with the dynami ...

activate a CSS-only modal with JavaScript

Is it possible to trigger a pure CSS modal using JavaScript (jQuery) without the need for a label, so that it activates when a user visits a page? http://jsfiddle.net/h84nubzt/ <label class="btn" for="modal-one">Example</a> <!-- Modal ...

Converting Hibernate Set to JSON format

public Class B { @Column private String name; private Set<A> values; @ManyToMany(fetch = FetchType.EAGER) @Fetch(FetchMode.JOIN) public Set<A> getValues() {//manytomany return values; } public void setValue ...

Action creator incomplete when route changes

In my React-Redux application, there is an action creator that needs to make 4 server calls. The first three calls are asynchronous and the fourth call depends on the response of the third call. However, if a user changes the route before the response of t ...

jquery global variable not working as expected

I'm having trouble making some variables global outside the jQuery function. I've tried using 'var' to declare them first and then assigning values, but when I try to log() them at the end, I get undefined. var lat, lon; $.get('ip ...

The compilation of the Angular application is successful, however, errors are arising stating that the property does not exist with the 'ng build --prod' command

When compiling the Angular app, it is successful but encountered errors in 'ng build --prod' ERROR in src\app\header\header.component.html(31,124): : Property 'searchText' does not exist on type 'HeaderComponent&apo ...

Exploring outside iframe data

My webpage includes an iframe A with a src attribute that links to a URL containing another embedded iframe B. I'm trying to figure out if it's possible to access the src of this nested iframe B. However, it appears that browser security measures ...

Revamp the sequence of divs using jQuery

<div class="example first">111</div> <div class="example second">222</div> <div class="example third">333</div> Can the order of these divs be changed using jQuery? I am looking to get: <div class="example second"&g ...

Changing the border color of a Material UI textbox is overriding the default style

Upon the initial page load, I expected the border color of the text box to be red. However, it appeared grey instead. I tried setting the border color to red for all classes but the issue persisted. Even after making changes, the border color remained unch ...

What methods can be used to center a Google map on a specific location?

I am facing an issue with three map canvases on different divs. Despite setting the center to the same position in all three of them using JavaScript, the second and third maps do not seem to reflect that center. Does anyone have any insights on what cou ...

How to incorporate a JavaScript file into a Handlebars template

I am having trouble receiving calls to my JavaScript file. What could be the issue? Using MVC. Here is the code in view file, file.hbs: <div class="container"> <h2 onClick="test()">Title</h2> {{>list}} </div> <script sr ...

Tips for managing Material-ui's <Autocomplete/> component based on the option's id

When dealing with HTML select in React, it's common to use an id or key to keep track of the selected value: <select value={value} onChange={(event) => setValue(event.target.value)}> {options.map((option) => ( <option value={optio ...

Navigating a plethora of unpredictable identifiers using AngularJS

My goal is to display content from a json file that varies in type and consists of pages divided into chapters. Users can navigate through the content using an aside menu or next and previous buttons. Currently, I am able to display the content by inserti ...

Accessing JSON data from a database using Angular

Wondering if there is a way to effectively access and manipulate JSON data stored in a database using Angular. While researching online, I keep coming across methods for reading JSON files from the Asset Folder, which does not align with what I need. What ...

Challenges arise with CSS alignment when adding d3.js charts to a webpage

I'm puzzled by the empty space that appears between the left column (highlighted in the image) and the header. This peculiar gap only seems to occur when the middle column is filled with a chart. I've scrutinized the code using Chrome Developer t ...

The persistent Bulma dropdown glitch that refuses to close

In the project I'm working on, I have implemented a Bulma dropdown. While the dropdown functions correctly, I am facing an issue when adding multiple dropdowns in different columns with backend integration. When one dropdown is open and another is cli ...

Is it always the case that modifying the props of a child component will trigger a re-render of the parent component, even

I am currently exploring ways to prevent a modal element from re-rendering when it is supposed to be hidden. The tutorial I am following suggests converting the component to a class-based one and using shouldComponentUpdate(). However, I wanted to test if ...

using JavaScript to send numerous text box values to various views

I have a dilemma with passing values between two views. In View1, there are text boxes for entering basic information. After the customer enters this data and clicks on 'add more details', I want to transfer these details to the text boxes in Vie ...

The Material-UI DataGrid feature allows for the display of column sums, with the sum dynamically updating based on applied filters

I am struggling with calculating the sum of values in the Total Amount column of my Material-UI DataGrid. How can I achieve this and ensure that the sum is also updated when a filter is triggered? Any guidance on how to sum the entire Total Amount column ...

What is the best way to initially hide a div using slide toggle and then reveal it upon clicking?

Is there a way to initially hide the div tag and then animate it in a slide toggle effect? I attempted using display:none on my '.accordion_box' followed by show() in slideToggle, but this results in adding the CSS property display: block. My goa ...